有没有办法在div之间有一个“换行符”？

Question

所以我有一个菜单，4个菜单点，我想把它们放在2x2的正方形中。有没有办法做到这一点没有前两个班级和其他班级一个？

感谢您的帮助：）

更新： 我做了一些混乱，我正在使用弹性盒结构，我很抱歉没有发布这些信息：

  ul {
  -webkit-box-orient: horizontal;
  }

  ul li {
    -webkit-box-flex: 1;
    height: 44%;
    margin: 3%;
  }

Answer 1

不确定。例如，您可以使用浮动并相应地设置宽度。请参阅下面的示例，或http://jsfiddle.net/BUPX7/获取实时示例。

<强> HTML

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
    <li>Item 4</li>
</ul>

<强> CSS

ul {
    width: 200px;
}

ul li {
    width: 100px;   
    margin: 0;
    padding: 0;   
    float: left;
}

Answer 2

默认情况下，div元素之间存在换行符。你显然使用一些CSS来覆盖它。您需要相应地修改CSS代码，或选择其他方法。

假设“菜单点”是链接，最简单的方法是使用

<div><a ...>link1</a> <a ...>link2</a></div>
<div><a ...>link3</a> <a ...>link4</a></div>

但是如果你正在使用一些精心设计的标记并且希望仅在CSS中创建中断，那么你可能需要一些精心设计的选择器，如:nth-child(3)。