何がしたいかと言うと、 こういうレイアウトを考えているとします。 背景がグレーのボックスにサムネイル画像が9枚並んでいますね。 floatでずら~っと並べるのが一般的かと思いますが、サムネイルのボックスにつけたclassに一括でmarginを指定すると こういう感じになり、両端か片端に隙間が空いてしまいます。 隙間を空かないようにするには、端にくるボックスにのみ違う指定をしてあげればいいのですが、 「ループ処理で表示させている」、「ECサイトのシステムなどで個別にclass名をふることが出来ない」 という状況がちょいちょい訪れます。 そこで、サムネイルボックスに同じcss指定をしつつ、左右ピッタリに並べる方法を紹介します。 まずhtmlから。 <div id="container"> <div class="outer"> <div class="inner"></div> <div cl