[CSS]横並びのレイアウトをfloatで配置するTIPS -Floater

CSS Globeでは、下記の画像のような横並びのレイアウトを単純にfloatでレイアウトするのではなく、一工夫してレイアウトを行っています。

Css Globe - Floater

Floaterで紹介されているテクニックは、左のエレメントにはheightを指定し、右のエレメントにはfloat:rightとheight分のマイナスマージンを指定します。

CSSオフ時は、右の画像のように綺麗にマークアップされた状態で表示されます。

マイナスマージンの使用は好きではないのですが、これからはマイナスマージンや背景画像の使用を、忘れないように検討しようと思いました。