floatの回り込み解除
スタイルシートで段組みレイアウトをするときfloatを使うことがあります。ですがfloatを繰り返すとレイアウトが崩れてしまいます。原因はだいたいclear忘れです。しかるべき場所にclearを入れてあげることで解決できるので、（<div style=”clear: both”></div>）こんなふうにでも書けばなんとかなります。
が、これは気持ちが悪い。
意味のないタグが氾濫しちゃいます。
で、この気持ち悪さを解消してくれるのが「clearfix」。
提唱者とされてるのはこちらの方↓
http://www.positioniseverything.net/easyclearing.html
っと、いつのまにか更新されてる…
前はこういう風でした。
.clearfix:after {
content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
それが今はこうなってます。
<style type=”text/css”>
.clearfix:after {
content: “.”;
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.clearfix {display: inline-block;} /* for IE/Mac */
</style><!– main stylesheet ends, CC with new stylesheet below… –>
<!–[if IE]>
<style type=”text/css”>
.clearfix {
zoom: 1; /* triggers hasLayout [...]
意外にしらないタグの意味
HTMLのタグってどう読んでいますか？
<a>は「エータグ」とか<br>は「ビーアール」とか、自分ルールで読んでることが多いんじゃないでしょうか。人には言えないような呼び方を心の中でつぶやいてたりとか。
試しに（a href）をどう読んでるかまわりのスタッフに聞いてみると、
「エーエイチレフ」
「エーハーフ」
「アーフレッフ」
と様々。
ある程度共通の呼び名とかあるかもしれませんが、付加情報を埋め込む特殊な文字列なので正しい読み方みたいなのはないような気がします。
で、わたしはどう読んでるかというと、口には出しませんが、心の中で「タグを英語にして」読んでます。例えば、上記の（a href）であれば「アンカーハイパーテキストリファレンス」と読んでます。「Anchor Hypertext REFerence」です。こう読むと、自分流で自信なくつぶやくよりもスッキリした感じしませんか？タグの意味をそれっぽく意識できちゃいますし。
コーディングの際に、タグの意味まで意識できればより的確なマークアップができる、カモです。
知ってるようで知らない（と思う）よく使うタグの意味をmemo。
a href = Anchor Hypertext REFerence
img src = IMaGe SouRCe
br = BReak（改行）
p = Paragraph（段落）
<h1>〜<h6> = Heading（見出し）
hr = Horizontal Rule（水平方向の罫線）
th = Table Header
tr = Table Row
td = Table Data
ul = Unordered List（順序の無いリスト）
ol = Ordered List（順序のあるリスト）
dl = Definition List（定義リスト）
dd = Definition Description（定義の説明）
li = List Item
※（href）や（src）はタグではありません。タグ内部に記述される「属性（attribute）」です。
※注意：これは、これを略しました、のような定義というか公式の解説はありませんのであしからず。ある種の「暗黙の了解」みたいなものです。
もっときちんと知りたい方はこちら↓をご参照ください。
http://www.w3.org/TR/1999/REC-html401-19991224/index/attributes.html
