如何使用CSS设置四个并行DIV

Question

我搜索了教程，但它们只显示了如何设置三个并行div。

是否可以更改此代码，并放置4个并行div？

<div style="width:90%;border:1px solid #000;">
    <div style="float:left; width:33.3%; background:#aaa;">one</div>
    <div style="float:left; width:33.3%; background:#bbb;">two</div>
    <div style="float:left; width:33.4%; background:#ccc;">three</div>
<div style="clear:both;"></div>

Answer 1

这就是您想要的吗？

<div style="width:90%;border:1px solid #000;">
    <div style="float:left; width:25%; background:#aaa;">one</div>
    <div style="float:left; width:25%; background:#bbb;">two</div>
    <div style="float:left; width:25%; background:#ccc;">three</div>
    <div style="float:left; width:25%; background:#ddd;">four</div>
<div style="clear:both;"></div>

Answer 2

<div style="float:left; width:25%; background:#aaa;">one</div>
<div style="float:left; width:25%; background:#bbb;">two</div>
<div style="float:left; width:25%; background:#ccc;">three</div>
<div style="float:left; width:25%; background:#ddd;">four</div>

只需再添加一个div标记并将其等分，就可以得到四个div！