<分区>
我基本上想要的是让每个子元素的高度来包裹它的内容。
这是我的代码:
<style>
.parent{
display: flex;
}
.child{
padding: 5px;
margin: 10px;
background: green;
height: auto;
}
</style>
<div class="parent">
<div class="child">child1</div>
<div class="child">child2</div>
<div class="child">child3</div>
<div class="child" style="height:50px">child1</div>
</div>
输出:
预期输出:
最佳答案
你只需要设置align-items: flex-start在父元素上，因为默认值为 stretch。
.parent {
display: flex;
align-items: flex-start;
}
.child {
padding: 5px;
margin: 10px;
background: green;
height: auto;
}<div class="parent">
<div class="child">child1</div>
<div class="child">child2</div>
<div class="child">child3</div>
<div class="child" style="height:50px">child1</div>
</div>关于html - 如何使 flex 子高度包裹内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45303143/
相关文章：
javascript - 让scrollTo让div一直滚动？
html - CSS 和 Bootstrap : Create a line that connects rows
jquery - 我可以使用 CSS 在 <td> 中对齐 <div> 吗？
javascript - HTML 根据滚动大小自动隐藏文本(如在 Gmail 中)？
css - 如何使用 css 将我的第二张 bg 图像 "url(repeat_bg_right_side.png) "重新定位到页面右侧？
html - 如何 flex 基础 : 0% and flex-grow factor calculates the computed width?