忍者ブログ

GAM-22のメモ

とりあえず、IE8対策

2017.05 ← 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 →

[PR]

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

とりあえず、IE8対策

はじめに

IE8 beta1をインストールしてみたところ、当ブログも、微妙に崩れているので、とりあえず対策しようというものです。あんまり期待しないでください。

と言うか、たぶん読みにくいし、写真を使わずに、<hr> はボーダーを指定しないとダメです。みたいな感じの方が、理解しやすいと反省中です。糞記事です。

注意

DOCTYPE宣言によっては、IE8の挙動が異なるようです。ここではHTML1.0にしています。

IE7は、IE8を「IE7エミュレート・モード」で動かした状態として検証しています。

<hr>タグの太さ

<!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
hr 1 ie7
IE8
hr 1 ie8

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>
IE7
hr 2 ie7
IE8
hr 2 ie8

下ボーダーの太さを、1pxにしています。マージンもちゃんと指定します。

水平線と直接関係無いですが、bodyのマージンと、基準位置を指定した方が良いです。

PR
この記事にコメントする
お名前
タイトル
文字色
URL
コメント
パスワード Vodafone絵文字 i-mode絵文字 Ezweb絵文字
この記事にトラックバックする
トラックバックURL:
カテゴリー
カウンター
最新記事
最新コメント
Twitter
人気記事
Amazon お買い得情報
Amazon お買い得情報
プロフィール
自画像
HN :
GAM-22
性別:
男性
職業:
大学1年生
HSP暦:
6年
好きなもの :
ゲーム, アニメ, マヨネーズ
嫌いなもの :
運動, 注射, ホラー映画, 英語
好きなバンド :
Muse, Radiohead
その他 :
文章能力が欠如している
バナー
Copyright © GAM-22のメモ All Rights Reserved
Powered by ニンジャブログ Designed by ピンキー・ローン・ピッグ 忍者ブログ / [PR]