« なかなか面白いTwitter | ブログ トップ | 解像度ではなくレンダリングエリアで解析 »

first-letterのバグ

注釈(※)などをインデントするにあたり、いろいろトラブったのでメモ。

■margin-leftを使うとIE6でボックスサイズが広がるのでプラス側はpaddingにする。

p.indentA01 {
	margin-left: 0.7em;
}
p.indentA01:first-letter {
	margin-left: -0.7em;
}

を下に変更

p.indentA01 {
	padding-left: 0.7em;
}
p.indentA01:first-letter {
	margin-left: -0.7em;
}

■似たクラスを続けて記述すると、スタイルが効かなくなるのでバラして記述する。

div.captionA01 p.indentA01,
div.captionA02 p.indentA01,
div.captionA01 p.indentA01r,
div.captionA02 p.indentA01r {
	padding-left: 0.7em;
}

を下に変更

div.captionA01 p.indentA01,
div.captionA02 p.indentA01 {
	padding-left: 0.7em;
}
div.captionA01 p.indentA01r,
div.captionA02 p.indentA01r {
	padding-left: 0.7em;
}

IE6が本当に使えない。
あとUTF-8で※が文字化けするのってどうやって回避するんだろ。

トラックバック

このエントリーのトラックバックURL:
http://blog.ikesai.com/cgi-bin/mt-tb.cgi/245

コメントを投稿

(いままで、ここでコメントしたことがないときは、コメントを表示する前にこのブログのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)