Перейти до вмісту
Пошук в
  • Детальніше...
Шукати результати, які ...
Шукати результати в ...

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


kavi

Recommended Posts

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

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

Надіслати
Поділитися на інших сайтах


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

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

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

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

 

image.png.009dc1a1e6717cb3c89ec59f34160782.png

Надіслати
Поділитися на інших сайтах


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

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

Сначала  идет блок-обертка 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

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

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

Змінено користувачем jaffagold
Надіслати
Поділитися на інших сайтах


Створіть аккаунт або увійдіть для коментування

Ви повинні бути користувачем, щоб залишити коментар

Створити обліковий запис

Зареєструйтеся для отримання облікового запису. Це просто!

Зареєструвати аккаунт

Вхід

Уже зареєстровані? Увійдіть тут.

Вхід зараз
  • Зараз на сторінці   0 користувачів

    • Ні користувачів, які переглядиють цю сторінку
×
×
  • Створити...

Important Information

На нашому сайті використовуються файли cookie і відбувається обробка деяких персональних даних користувачів, щоб поліпшити користувальницький інтерфейс. Щоб дізнатися для чого і які персональні дані ми обробляємо перейдіть за посиланням . Якщо Ви натиснете «Я даю згоду», це означає, що Ви розумієте і приймаєте всі умови, зазначені в цьому Повідомленні про конфіденційність.