中央寄せのレイアウトなのにバージョンによって中心に寄らない /Dreamweaver入門 ドリームウィーバーの使い方

ドリームウィーバーの使い方

HOME > ブラウザ違い・バージョン違いによるズレ等の解決方法 > 中央寄せのレイアウトなのにバージョンによって中心に寄らない

中央寄せのレイアウトなのにバージョンによって中心に寄らない

ブラウザの真ん中寄せのレイアウトのはずなんだけど・・・旧バージョンのIEで見ると左に寄ってる!

このように中央寄せするはずが・・・
ブラウザの真ん中寄せのレイアウトのはずなんだけど・・・旧バージョンのIEで見ると左に寄ってる!

左に寄ってしまう
旧バージョンのIEで見ると左に寄ってる!

原因 CSSの設定ミス

margin: 0px auto; という設定での中央寄せが旧バージョンのブラウザでは適用されない。

解決方法

旧バージョン用にページ全体を text-align: center で中央寄せにしておく。
※そうするとブロックの中身のテキストも中央寄せになるので、ブロックの中身の文字の整列は調整する。

これだけだと中央に寄らない

<div class="mannaka"></div>

div.mannaka {
margin: 0px auto;
}

こう変更すると旧バージョンでも中央寄せになる

<div style="text-align:center;">
<div class="mannaka"></div>
</div>

div.mannaka {
margin: 0px auto;
text-align: left;
}


もしこの記事が役に立ちましたら、ぜひブックマークやブログ・twitterで紹介して下さい。

 

 このエントリーをはてなブックマークに追加  このエントリーを含むはてなブックマーク   twitter      

 

その他のDreamweaverのよくある質問と解決方法


▲トップページへ