小编Jen*_*ard的帖子

具有可变高度的Bootstrap行元素

我目前正在使用Twitter Bootstrap开发一个网站.

我的情况:单个.row元素包含多个元素.col-XX-XX,高度可变(产品图像具有可变图像比率)

我的设计中的列数从视口大小到视口大小不等,这会禁用我只是通过创建几个.row包装器来分隔元素.

由于元素的个体图像,每个元素具有可变高度.如果大元素在其出现的实际行中首先出现,则可以显示没有元素的大空白区域(标记为红色).

.row中的可变元素高度

我唯一的解决方案是在列表中设置元素的预定义高度,以确保在显示下一个元素(在新行上)时不会发生"跳跃".

我也尝试使用javascript,找到元素的最大值,然后将所有元素设置为此高度,但这是一个不好的解决方案,因此大量的图像高度也会创建大的空白区域.

有没有人有一个很好的解决这个问题的方法?

twitter-bootstrap

4
推荐指数
1
解决办法
4214
查看次数

标签 统计

twitter-bootstrap ×1