「html」タグアーカイブ

html内に余計な記述をせず、floatを解除するcss

cssのtipsでは久々に目から鱗だったので、自分メモ。よくある左にナビゲーション左に本文を(または逆に)配置するレイアウト。左右に寄せたい要素float:left;またはfloat:right;を指定した場合、背景が消えたり、内容より短い高さになってしまう。flotで寄せた内容は親要素に含まれず、親要素にhightを指定していないとfloatした小要素より短くなってしまう仕様によるもの。

今までは、clear:both;を指定した<br />や空の<div></div>を最下部に入れて処理してたけど、空のdivやら意味のない要素をhtml内に記述するのはなんだか気が引ける。そう思って探してみたら、html内には余計な空要素等を追加することなく、cssだけで処理する方法が紹介されてました。

clearfixでfloatを解除 | d-spica

続きを読む html内に余計な記述をせず、floatを解除するcss

このエントリーをはてなブックマークに追加
はてなブックマーク - html内に余計な記述をせず、floatを解除するcss
Share on Facebook
Post to Google Buzz
Bookmark this on Yahoo Bookmark
Bookmark this on Livedoor Clip
Share on FriendFeed
[`tweetmeme` not found]