IE8 beta1をインストールしてみたところ、当ブログも、微妙に崩れているので、とりあえず対策しようというものです。あんまり期待しないでください。
と言うか、たぶん読みにくいし、写真を使わずに、<hr> はボーダーを指定しないとダメです。みたいな感じの方が、理解しやすいと反省中です。糞記事です。
DOCTYPE宣言によっては、IE8の挙動が異なるようです。ここではHTML1.0にしています。
IE7は、IE8を「IE7エミュレート・モード」で動かした状態として検証しています。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="ja"> <head></head> <body style="background: #AAA; margin: 0px;"> <hr style="height: 1px; border: solid #ddd;"> </body> </html>
IE7では、これだけで、太さ1pxの水平線を引けました。しかし、IE8では、ボーダーで太くなり、上下マージンが0になります。
次が、改良版です。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html lang="ja"> <head></head> <body style="position:absolute; background: #AAA; margin: 0px;"> <hr style="height: 1px; margin: 5px 0px; border: solid #ddd; border-width: 0px 0px 1px;"> </body> </html>
下ボーダーの太さを、1pxにしています。マージンもちゃんと指定します。
水平線と直接関係無いですが、bodyのマージンと、基準位置を指定した方が良いです。
