人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

CSSをつかってホームページを作っています。
幅760px、高さ224pxのヘッダーを作ったので、
画面中央に表示させたいのですが、どうしても左に寄ってしまい動きません。どうすればいいでしょうか?
一応今の内容はこのような感じです。ブラウザはIE6を使ってます。
「HTML」
<TITLE>テスト</TITLE>
<link rel="stylesheet" href="header.css" type="text/css">
</HEAD>
<BODY>
<div id="header">
<h1>h1 ヘッダ </h1>
</div>
</BODY>
</HTML>

CSS
#header{ width: 760px;
height: 224px;
background:#9966dd;
margin-left:auto;
margin-right:auto;
}



●質問者: hiroshisp
●カテゴリ:コンピュータ ウェブ制作
✍キーワード:background margin テスト ブラウザ ホームページ
○ 状態 :終了
└ 回答数 : 1/1件

▽最新の回答へ

1 ● wizemperor
●60ポイント

IE6以下はバグのせいでmarginにautoを指定したセンタリングができません。

代わりにtext-alignでブロックレベル要素がセンタリングされるバグがあるのでこれを利用します。

http://cssbug.at.infoseek.co.jp/detail/winie/b035.html

下のようにすると上手く行くと思います。

body {

text-align: center; /* IE6以下ではブロックレベル要素もセンタリングされる */

}

#header{

width: 760px;

height: 224px;

background:#9966dd;

margin-left:auto;

margin-right:auto;

text-align: left; /* 左寄せに戻す */

}

◎質問者からの返答

ありがとうございます!うまくいきました。

そんなバグがあるとは知りませんでした。

最近CSSの勉強を始めたばかりなのに、

いきなり苦戦して困っていました。

ありがとうございました。

はてなでまた似たような質問をすると思います。

よろしくお願いします? m(_ _)m

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ