【问题标题】:How to limit the number of lines in grid css?如何限制网格css中的行数?
【发布时间】:2022-01-15 08:22:28
【问题描述】:

我想制作 2 列,每列 5 个元素。我目前有 6 个元素,这意味着其中 5 个应该放在第一列,第六个应该放在第 2 列。 应该:

但现在:

html:
 <ul class="footer-menu">
    <li><a href="#">Maps</a></li>
    <li><a href="#">Style</a></li>
    <li><a href="#">About</a></li>
    <li><a href="#">Exebitions</a></li>
    <li><a href="#">Contacts</a></li>
    <li><a href="#">Shop</a></li>
</ul>
css:
    .footer-menu {
     display: grid;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: repeat(5, 1fr);
    }

【问题讨论】:

  • 你能把 HTML 发给你吗,如果我们看不到你做了什么,我们无法帮助你
  • 他们投反对票是因为你的问题格式不好,见How to Ask
  • @Coja 我编辑了我的问题

标签: html css css-grid


【解决方案1】:

让我们看看这个属性

grid-auto-flow: column

See CanIUse usage of this property

See w3c documentation about this property

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-10-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-11-28
    相关资源
    最近更新 更多