блоки одинакового размера

голоса: 0

Подскажите как сделать блоки одинакового размера.

сейчас это выглядит вот так:

 

Адрес сайта http://www.aksshop.ru/
| Автор: | Категория: Дизайн сайта

Ответов: 1

Голоса: +1
 
Лучший ответ

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

  • Если делать фиксированную ширину для блоков, так здесь так же проблема так как класс wrapper-hover  используется как в блоке новинки так и в блоке категории товаров, делаем фиксированную высоту и тянется в обоих местах.
| Автор:
Выбор ответа лучшим | | Автор: Yuri_Geruk
Я это знаю по этому и задал вопрос, решение какое то есть?
aksshop,

Решение есть, зафиксировать высоту фото и обрезать длину названия материала, стилями будет выглядеть так:

.goods-list .product-image img {max-height:190px;}
.goods-list .product-name {white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

иного более мягкого решения я сейчас не вижу.

Ерунда получается какая то.
  1. Flexbox
  2. Выравнивать высоту скриптом
  3. Фиксированная высота фото и описания
aksshop,
Либо как вам ниже пишут, пользоваться плагином и равнять скриптом.
Нашел вот здесь статейку: http://zubarev.me/blog/javascript/vyravnivanie-vysoty-neskolkikh-div-blokov-s-pomshchyu-javascript  Вроде получилось выравнить блоки но функция <body onresize = "EqualizeColumns('equalized_block');">не всегда почему то срабатывает и еще сайт слегка подтармаживает. Посмотрите может есть какой дельный совет
...