今回はCSSに関してのワンポイントアドバイス。
以前も、SafariでCSSを使った角丸罫囲みに隙間が空いてしまうことがあったのですが、
それと似たようなことが今度はIE6で起きました。
何故だか理由はわからないのですが<p>タグで囲まれたテキストに対しての「margin-top」にマイナスの値を入力すると、どこからか罫線が現れてくるという現象です。
<div>タグが入れ子になっているためにどこからか背景が現れているような気はするのですが、
いくら「margin」の指定を変えても消えない。マイナスにしないと大丈夫。
しかも、IE7では問題ないのでIE6特有のバグでしょう。
そういえば以前、リスト<li>タグに関するバグではまったこともあったけど、
あれもIE6だったはず。
で、いろいろやってみてふと、上記のSafariの記事のことを思い出し、
行送り(vertical-align)をいじってみると。。
直った。
今回は大き目の数値を入れたら直りました。
■教訓
CSSでデザインをする際、微妙に隙間が空いたり、なぜだか罫線が入ってしまったりしたときは「行送り(vertical-align)」を怪しんでみましょう。
□おススメ本

詳解HTML&XHTML&CSS辞典 第3版
僕はこれでCSSを覚えました。(ちなみに初版)