【问题标题】:On flexbox did the wrap work on the height在 flexbox 上,对高度进行了换行
【发布时间】:2017-03-27 20:30:23
【问题描述】:

我需要将项目放入列中,当窗口变窄时,此列会分成新列,我可以在 flexbox 中执行此操作吗?

【问题讨论】:

  • 您需要提供您当前正在使用的代码,否则人们将很难为您提供帮助。
  • 也许您正在寻找flex-wrap 属性。

标签: html css flexbox


【解决方案1】:

.flex-container {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap:wrap;
    width: 400px;
    height: 250px;
    background-color: #ccc;
}

.flex-item {
    background-color: #050;
    width: 150px;
    height: 300px;
    margin: 10px;
}
<div class="flex-container">
  <div class="flex-item">flex item 1</div>
  <div class="flex-item">flex item 2</div>
  <div class="flex-item">flex item 3</div>  
</div>

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-11-03
    • 1970-01-01
    • 1970-01-01
    • 2017-05-31
    • 2020-02-08
    • 1970-01-01
    • 2020-02-07
    • 2017-06-11
    相关资源
    最近更新 更多