Разваливается сетка товара

Iga

Гуру форума
Регистрация
12 Янв 2014
Сообщения
425
Реакции
83
Сайт на wp, тема motors.
В разделе магазина Для просмотра ссылки Войди или Зарегистрируйся слетает вёрстка(дырки в сетке) если менять сортировку товара и при перелистывании страниц пагинации.
Помогите найти закономерность, не могу понять откуда ноги проблемы растут!
 
Сайт на wp, тема motors.
В разделе магазина Для просмотра ссылки Войди или Зарегистрируйся слетает вёрстка(дырки в сетке) если менять сортировку товара и при перелистывании страниц пагинации.
Помогите найти закономерность, не могу понять откуда ноги проблемы растут!
Допишите в файл CSS:

.woocommerce .products ul li, .woocommerce ul.products li:nth-child(3n+1) {
clear: both;
}
 
Элементарно! Ватсон. Высота col у вас разная по причине разной длины заголовка, в одном случае помещается в одну строку, в другом в две, а может быть и ситуация когда будет три строки. Выходов много
Например такой:
ul.products li {height: 500px;}
Мы указываем фиксированную высоту для col. Не очень изящное решение, лучше действовать тоньше и указать фиксированную высоту для самого заголовка
типа такого:
.stm-product-inner h5 {height: 50px;}
 
  • Нравится
Реакции: Iga
Высота col у вас разная по причине разной длины заголовка
Диствительно!:)

Можно попробовать с помощью jquery вытянуть колонки в одинаковую высоту, но, думаю, решение на css изящнее.
 
Назад
Сверху