Описание товара не влазит по ширине на мобильном

[kavi]

Подскажите пожалуйста как заставить браузер мобильного переносить слова, не помещающиеся в окне? На телефоне отображается также, как и на симуляторе

http://webmark.com.ua/mobile/?url=http%3A%2F%2Firis-color.com.ua%2F

[proplat]

26 минут назад, kavi сказал:

Подскажите пожалуйста как заставить браузер мобильного переносить слова, не помещающиеся в окне? На телефоне отображается также, как и на симуляторе

http://webmark.com.ua/mobile/?url=http%3A%2F%2Firis-color.com.ua%2F

у меня все отображается коректно, скорее всего текст откуда то скопировали вместе со всем html кодом

 

[jaffagold]

У вас проблема в разметке 

Обычная разметка бутстрап:

Сначала  идет блок-обертка div.container у которого

.container {

padding-right: 15px;

padding-left: 15px;

}

А потом в него вкладывают div.row, который эти паддинги убирает, чтобы прижать блоки ближе к краям обертки с помощью отрицательных марджинов.

.row {

margin-right: -15px;

margin-left: -15px;

}

 

 

Спойлер

<div class="product-layout product-list col-xs-12">
    <div class="product-container">

        <div class="item-inner">

           <div class="row">

               <div class="left-block col-xs-12 col-sm-4 col-md-4">
                     <div class="products">

В вашем случае не используется стандартный div.container

а div class.product-container, у которого нет стандартных стилей div.container

Даже, если ему дописать класс div class="product-container container"

это проблему не решает, потому что, хотя блок и сужается, но отображение режет блок div.item-inner

У которого в стилях прописано

Спойлер

.item-inner {

border: 0;

padding: 0;

position: relative;

display: inline-block;

width: 100%;

/* overflow: hidden; */

}

Если этот хидден отключить, то все отображается.

Но надо разобраться как это отобразится по всему сайту в разных разрешениях экрана.

Иными словами.

У вас 2 глюка:

У вас блок div.row оказывается шире чем div.inner и div.inner обрезает края за счет стиля overflow: hidden;)

Кроме того, из-за того, что у вас  div.row вложен не в  div.container, а в обычный div

ширина контента получается больше ширины экрана и появляется горизонтальная полоса прокрутки.

Кстати, какой-то баг форума- цепляет чужие картинки в сообщение при исправлении сообщения.

Змінено 29 вересня 2017 користувачем jaffagold