Перейти к содержанию

Рекомендуемые сообщения

Добрый день.

 

Редактировал сайт, шаблон, выводы и тд.

По итоге заметил что на главной странице слетела сетка товаров, битый час сижу не могу понять в чем проблема.

Может кто то сталкивался? Стоит 4 товара в ряду, 1 ряд -4 товара, 2 ряд - один товар, 3 ряд - 4 товара.

Сайт vicdsoie.com

Прикрепит скрин для наглядности.

 

Заранее благодарен!

 

2018-09-14_17-51-16.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Типичная проблема бутстрапа на флоатах, один из товаров выше остальных, возможно из-за переноса заголовка, попробуйте задать высоту товара больше чем сейчас, или ради эксперимента просто через инспектор подрежьте текст в заголовках и посмотрите что будет..

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

https://vicdsoie.com/catalog/view/theme/butik/stylesheet/stylesheet.css строка 2239:

.product-thumb .caption {
    padding: 0 20px;
    min-height: 70px;
    text-align: center;
}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
59 минут назад, todaymars сказал:

https://vicdsoie.com/catalog/view/theme/butik/stylesheet/stylesheet.css строка 2239:

.product-thumb .caption {
    padding: 0 20px;
    min-height: 70px;
    text-align: center;
}

Не заметил, что к посту ссылку прикрепили. 70 маловато, там 80 желательно, а в идеале и все 90 на всякий случай...

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
2 часа назад, GetWeb сказал:

один из товаров выше остальных,

В данном случае, ниже. Последний товар в первом ряду имеет название в одну строку, а предыдущие в две.

 

Можно задать высоту названию. Для этого в конце файла: catalog/view/theme/butik/stylesheet/stylesheet.css

добавить строку:

.product-thumb h4 {height: 32px;}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

И проверить, что получилось на маленьких экранах.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Во первых всем огромное спасибо за помощь!!

 

Отпишусь о результате.

4 часа назад, todaymars сказал:

https://vicdsoie.com/catalog/view/theme/butik/stylesheet/stylesheet.css строка 2239:

.product-thumb .caption {
    padding: 0 20px;
    min-height: 70px;
    text-align: center;
}

Работает, но на разных разрешениях прыгает.

 

2 часа назад, SiteMix сказал:

В данном случае, ниже. Последний товар в первом ряду имеет название в одну строку, а предыдущие в две.

 

Можно задать высоту названию. Для этого в конце файла: catalog/view/theme/butik/stylesheet/stylesheet.css

добавить строку:

.product-thumb h4 {height: 32px;}

Работает на всех разрешения, спасибо!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
10 минут назад, vds сказал:

Работает на всех разрешения, спасибо!

Но тут есть нюанс - если есть (или будут потом) названия больше двух строк в высоту, то нужно будет либо увеличить высоту блока, либо скрывать всё что превышает эту высоту. Но пока выборочно просмотрел и названий больше двух строк не увидел.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.