html - 均匀或均等地分配 DIVS……是的，我知道我应该使用表格

Question

我有以下 HTML 代码/结构:

<div id="container">
 <div id="div1">text</div>
 <div id="div2">more text</div>
 <div id="div3">nice text</div>
 <div id="div4">bad text</div>
 <div id="div5">hello world</div>
 <div id="div6">foo</div>
 <div id="div7">bar</div>
 <div id="div8">Dick Beatie</div>
 <div id="div9">Chuck Norris</div>
 <div id="div10">Brian Blessard</div>
</div>

并说我有以下 CSS:

#container{
  overflow:auto; 
  width:100%;
}

#container div{
 float:left;
 padding:10px;
 text-align:center;
 width:10%;
}

容器内的 DIV 大小相同，但不适合容器!当它们溢出到当前的下一行时，我如何使它们适合。请不要说我应该使用表格，我知道我应该使用表格。我也意识到我可以减少 DIV 的宽度，但是我必须调整容器的宽度。

感谢您的建议。

附言。我敢打赌，有些 clown 说要用 table !

Answer 1

使用box-sizing: bordex-box使填充包含在宽度中。