Javascript jQuery选择器,用于将更高的内联块div放入其容器中';s排

Javascript jQuery选择器,用于将更高的内联块div放入其容器中';s排,javascript,jquery,html,css,Javascript,Jquery,Html,Css,我有一个容器中的div列表 HTML: <div class="container"> <div class="item">item 1</div> <div class="item">item 2 some text some text some text</div> <div class="item">item 3</div> <div class="item">i

我有一个容器中的div列表

HTML:

<div class="container">
    <div class="item">item 1</div>
    <div class="item">item 2 some text some text some text</div>
    <div class="item">item 3</div>
    <div class="item">item 4</div>
    <div class="item">item 5 some text/div>
    <div class="item">item 6</div>
    <div class="item">item 7 some text some text some text some text some text some text</div>
    <div class="item">item 8 some text</div>
    <div class="item">item 9</div>
</div>
在这种情况下,结果是“项目”具有不同的高度,与每个项目中的文本相关

我将更改“items”div的行为,以便行中较高的“item”div将其高度传递给其他div,但仅传递给同一行中的div

因此,每行的“项”必须具有其行的较高元素的高度

显然,如果我更改视口的大小,行的顺序会改变,排列也会改变


请用Jquery或javascript。

不需要javascript或Jquery。使用css3

.container{
边框:1px纯红;
柔性包装:包装;
显示器:flex;
}
.项目{
边框:1px纯绿色;
宽度:120px;
利润率:10px;
背景颜色:蓝色;
}

项目1
项目2一些文本一些文本一些文本
项目3
项目4
项目5一些文本
项目6
项目7一些文本一些文本一些文本一些文本一些文本一些文本一些文本一些文本一些文本
项目8一些案文
项目9

不需要JavaScript或jQuery。使用css3

.container{
边框:1px纯红;
柔性包装:包装;
显示器:flex;
}
.项目{
边框:1px纯绿色;
宽度:120px;
利润率:10px;
背景颜色:蓝色;
}

项目1
项目2一些文本一些文本一些文本
项目3
项目4
项目5一些文本
项目6
项目7一些文本一些文本一些文本一些文本一些文本一些文本一些文本一些文本一些文本
项目8一些案文
项目9

需要jquery或javascript,请。。。。你试过什么?我试过jquery。环顾四周,我发现最相似的解决方案是:@MatteoCorona为什么不验证每个高度div并将其提高?@MarcosSedrez我使用了这个解决方案,但它不喜欢它。当你看到有小文本结果的div时,它们是“空的”。对我来说,穆罕默德·乌斯曼的解决方案是简单和平衡之间的一个很好的折衷方案。需要jquery或javascript,请。。。。你试过什么?我试过jquery。环顾四周,我发现最相似的解决方案是:@MatteoCorona为什么不验证每个高度div并将其提高?@MarcosSedrez我使用了这个解决方案,但它不喜欢它。当你看到有小文本结果的div时,它们是“空的”。对我来说,穆罕默德·厄斯曼的解决方案是简单和平衡之间的一个很好的折衷方案。只是出于好奇:jquery解决方案呢?有什么建议吗?@MatteoCorona对不起,我所知没有这样的插件。只是出于好奇:jquery解决方案呢?有什么建议吗?@MatteoCorona对不起,我所知没有这样的插件。
.container {
    border: 1px solid red;
    padding: 10px;
}

.item {
    display: inline-block;
    border: 1px solid green;
    width: 120px;
    margin: 10px;
    background-color:blue;
}