html – 如何使flex子高度包装内容

发布时间：2020-12-14 23:00:16 所属栏目：资源来源：网络整理

导读：参见英文答案 How to disable equal height columns in Flexbox?????????????????????????????????????2个我基本上想要的是使每个子元素的高度包装其内容. 这是我的代码：输出：预期产量：最佳答案您只需要在父元素上设置 align-items: flex-start ,因

参见英文答案 > How to disable equal height columns in Flexbox?????????????????????????????????????2个
我基本上想要的是使每个子元素的高度包装其内容.

这是我的代码：


输出：

预期产量：


最佳答案
您只需要在父元素上设置align-items: flex-start,因为默认值为stretch.

.parent {
  display: flex;
  align-items: flex-start;
}

.child {
  padding: 5px;
  margin: 10px;
  background: green;
  height: auto;
}


                        （编辑：李大同）
【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!