如何让兄弟元素宽度跟随最长元素自动撑开?
css元素跟随最长元素等宽
如何在css中让兄弟元素的宽度与最长的元素一致?
以现有的代码为例,希望让红色和灰色元素的宽度跟随绿色元素的宽度撑开。
最简单的方法是将.container元素的宽度设为fit-content。然而,这会导致滚动条出现在body元素上。
因此,可以在.container元素外部再套一层div。修改后的代码结构如下:
<div class="wrap"> <div class="container"> <div class="item1">item1</div> <div class="item2">item2</div> <div class="item3">item3</div> </div> </div>
.wrap { width: 100%; overflow-x: auto; } .container { width: fit-content; } .item1 { background: red; } .item2 { background: gray; } .item3 { min-width: 1300px; background: greenyellow; }
以上就是如何让兄弟元素宽度跟随最长元素自动撑开?的详细内容,更多请关注其它相关文章!