[英]Same height for table-rows using CSS
I have N rows of content that user should match using drag and drop (user moves items on the right to the corresponding item on the left). 我有N行内容,用户应使用拖放匹配(用户将项目右侧的项目移动到左侧的相应项目)。 Here is an example:
这是一个例子:
All blocks should have the same height - the height of the largest item. 所有块应具有相同的高度 - 最大项目的高度。 (In this example the larges item is on the left, #2).
(在此示例中,大项目位于左侧,#2)。 Is it possible to do using pure CSS?
是否可以使用纯CSS? I can't use flexbox due to browser support.
由于浏览器的支持,我无法使用flexbox。 I have managed to implement this using JS, but I don't like that solution :)
我已经设法使用JS实现这个,但我不喜欢那个解决方案:)
Maybe someone could point me to the technique or a similar example? 也许有人可以指出我的技术或类似的例子?
Thanks in advance. 提前致谢。
Try this jquery code it detects the biggest element and sets all of them to that height. 试试这个jquery代码,它会检测出最大的元素并将它们全部设置为该高度。
var height = 0;
$(".table").find(".table-cell").each(function() {
height = Math.max(height, $(this).height());
});
$(".table").find(".table-cell").css("height", height);
Here is a JSfiddle example. 这是一个JSfiddle示例。
You need jquery for this so make sure adding the jquery library to your code. 您需要jquery,因此请确保将jquery库添加到您的代码中。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.