変なことをしてるので、その背景から^^;
一つの記事に複数ネタがあるとき、あとでリンクする必要があった時に備えてhrタグにidを設定するようにしていたのですが、いざリンクしようとしたらソースを見ないとidがわからなかったので、1年くらい前からhrタグをaタグで囲って線をクリックするとidが分かるようにしました。
こんなの↓
<a href="#0108ts1"><hr id="0108ts1"></a> [LINK]ただそれだと、たった2dotを正確にマウスでポイントする必要があるので、borderを大きくとってクリックしやすくしようとしたら不格好に……ならばとborderを背景色にしてbackground-colorを線のように見せようとheightを挿入したら、FirefoxとIE6の表示とIE8の表示が違うのでまたMSか……と思いその時は「IE8だけに適用させるCSSハック」でIE8の方をいじって以後忘れていました。
で、Chromiumをサブブラウザに使うようになってからhrが変だぞと思うようになって、そのうち調べようと思いつつ今に至ったのでした。
という話はどうでもいいわけですがw
試しにdivとhrに同じスタイルを適用して見ると(昨日まで4.のスタイルを使ってました)
4.の表示はFirefoxとIE6がおかしいんじゃなイカ?
Firefoxはなんでhrタグのheightの解釈が違うんだろう……しょうがないので、2.のスタイルを採用して、IE6/7だけ「<!--[if lt IE 8]> 〜 <![endif]-->」で4.のスタイル使うことにしました。
−追記−3.のスタイルについて、IE6でheight:1px;を指定しても1pxになりません(10pxくらい)でした。
で、後日談:hrタグをaタグで囲ったら怒られた
というわけでhrタグを使わず、aタグをdisplay:blockにして1.のスタイルが一番面倒がないという結果になりました。
 ̄ ̄ ̄ ̄ ̄ ̄○ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ O 。 , ─ヽ ________ /,/\ヾ\ / ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ ̄ |__|__|__|_ __((´∀`\ )< ・・・という覚書だったとさ |_|__|__|__ /ノへゝ/''' )ヽ \_________ ||__| | | \´-`)<ツマンネ |_|_| 从.从从 | \__ ̄ ̄⊂|丿/ |__|| 从人人从. | /\__/::::::||| |_|_|///ヽヾ\ / ::::::::::::ゝ/|| ────────(~〜ヽ::::::::::::|/
セコメントをする