[CSS] 幅いっぱい・等間隔にボックスを並べる

float:leftで右マージンを取ったとき、一番右のボックスだけ右マージンいらない　的な処理を一応メモっておこうかと。

<div id="wrapper">
<ul>
<li>コンテンツ１</li>
<li>コンテンツ２</li>
<li>コンテンツ３</li>
</ul>
</div>

#wrapper {
width: 500px; /*親ボックスの幅*/
overflow: hidden;
}

#wrapper ul {
width: 510px; /*右マージン含む子ボックス合計幅*/
margin-right: -10px; /*親ボックスからのはみ出しぶんをずらしとく*/
}

#wrapper ul li {
width: 160px;
float: left;
margin-right: 10px;
}

ul使うと分かりやすいんですが、全部divだったりすると囲うボックス一個忘れたりするのはわたしだけですｋ