小编arp*_*gie的帖子

高度 100% 弯曲

我想让内容 div 适合 100% 高度。由于某种原因,容器 div 恰好是一个弹性项目。将 Flex 项目中的 div 设置为 100% 高度是否合适?或者我也应该将内容 div 设置为弹性项目。

另外,弯曲方向部分也令人困惑。列不起作用,但行起作用。我想 flex-direction 只对弹性项目有影响。

jsfiddle在这里

<div class="wrapper">
  <div class="container">
    <div class="content">
      Hello there
    </div>
  </div>
</div>


html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

.wrapper {
  border: 1px solid red;
  padding: 20px;
  min-height: 100%;
  display: flex;
  /* change flex-direction from column to row will work */
  flex-direction: column;
}

.container {
  border: 1px solid green;
  padding: 20px;
  flex: 1;
}

.content {
  border: 1px …
Run Code Online (Sandbox Code Playgroud)

html css flexbox

3
推荐指数
1
解决办法
6735
查看次数

标签 统计

css ×1

flexbox ×1

html ×1