質問: ieでwebサイトのデザインが崩れる 先日初めてwordpressのテーマを自作してweb上にアップしました。 firefoxでアップしたサイトを確認したところ無事表示されていたのですが、手持ちのie9で確認したところデザインが崩れていました。。。 html,cssともに初心者で、どうすればieでレイアウトがちゃんと表示されるのかわからず困っています。 ここを直すとちゃんと表示されるよ~的なことを教えていただけるとありがたいです。 問題のサイト→http://webseisaku-idea.net/
回答: まず、 •余白にはmarginではなく、paddingを使用する。 •floatの使いすぎに注意。 •overflow: hiddenは背景が見えてもおかしくないように。 上記3点を確認して下さい。 次に、 条件付きコメントを使用し、にクラスを与えます。これは巧い方法で、且つvalidエラーもありません。 そして最後に1点、 サイトが左配置になっていたので中央配置にするのはどうでしょうか? html 1. 2. 3. ブロックレベル要素をセンタリング 4. ブロックレベル要素 5. 6. css 1..main { 2. width: 100%; 3. border: 1px solid #000; 4.} 5..main div { 6. width: 80%; 7. border: 1px solid #ff0000; 8. margin: 0 auto; 9.} センターリングしたい要素に「margin: 0 auto;」と指定するのが正しい方法です。 ※上記ソースでborderを使っているのは分かりやすくする為だけです。 サイト全体を中央配置にする方法↓ html 1. 2. 3.サイト全体を中央に配置にする 4.サイト全体を中央に配置にする為のテキスト 5. 6. css 1.body { 2. text-align: center; 3.} 4.div#wrapper { 5. width: 800px; 6. margin: 0 auto; 7. text-align: left; 8. border: 1px solid #ff0000; 9.} 健闘を祈る!