LINUX.ORG.RU

Вопрос по вёрстке bootstrap

 , ,


1

2
<div class="row row-eq-height">
	<?php foreach ($products as $product) { ?>
		<div class="col-md-3" style="border: 1px solid red;">
			<a href="<?php h("{$www_base}/product.php?id={$product->id}"); ?>">
				<div class="item-picture">
					<img src="<?php h($product->pic2); ?>" />
				</div>
				<div class="item-name">
					<?php h($product->name); ?>
				</div>
			</a>
		</div>
	<?php } ?>
</div>

Проблема в том что если div.col-md-3 в ряду получается с height больше чем остальные то на следущей строчке получается вот так: https://image.ibb.co/mzg0cw/Screenshot_at_2017_12_01_15_34_44.png

Как этого избежать?


Потому что float, нужно все одинаковые height. Переходи на bootstrap 4, там сетка на flex и таких уебанских проблем не будет

gobot ★★★★
()

ну или как вариант .row-eq-height .col-md-3:nth-child(4n+1) { clear: left; }

anonymous
()
Вы не можете добавлять комментарии в эту тему. Тема перемещена в архив.