• ベストアンサー

IE6だけ何故か左寄せになります

現在、Movable Type4.1でコツコツとホームページを作っています。 Movable Type用のテンプレートを作成する前に、XHTMLとCSSでまずページを作り、それをそれぞれのテンプレに作成してからアップロードをしています。 XHTMLの時にIE6ブラウザでチェックすると、問題なく中央揃えになっているのですが、Movable Typeにすると、何故か左寄せになってしまいます。 解決策がないかどうか色々調べてみたのですが、全然見当たりません。 CSSの方は、#wrap という全体を囲むIDに対して margin:0 auto; を設定しました。 *html #wrap{ margin-left:auto; margin-right:auto; } 上記もIE6に対して追加してみましたが、まったく反応なしです。 IE7やFirefox、オペラ、サファリ等はOKなのですが、どうも気になって仕方ありません。 また、Movable Typeを通すと、フォントサイズも大きくなってしまいます。 回避策や解決策などありましたが、教えてください!

質問者が選んだベストアンサー

  • ベストアンサー
  • maman53
  • ベストアンサー率18% (30/161)
回答No.1

外部CSSの一番先頭に以下をプラスなんだな * { margin: 0; padding: 0; }

nattymix
質問者

お礼

ご回答ありがとうございます! さっそく教えて頂いたスタイル設定を入れてみました。 …でもIE6は左寄せのままです… 私の場合、外部CSSをXHTML作成時と同様、各パーツ毎に振り分けてます。 (top←振り分け用、base, header,body,footerの計5つ) Movable Type には良くないんでしょうか。 ズラズラと長いスタイルもやだな~と思うのですが…

その他の回答 (1)

  • Muller3
  • ベストアンサー率81% (800/979)
回答No.2

XHTMLでできてMovable Typeにするとセンタリングできない、というのが??なのですが、 body { text-align: center; } はどうでしょう。 HTML冒頭にxml宣言が入っていると、IEでは後方互換モードで表示するバグがあるので、margin:0 auto;は効きません。

nattymix
質問者

お礼

ご回答ありがとうございます! >XHTMLでできてMovable Typeにするとセンタリングできない、というのが??なのですが、 そうなんですよね(笑) Movable Typeに組み込むと、IE6で検証した場合左寄せになります。 MTに組み込んでない、通常のXHTMLの場合は、IE6検証しても問題ありません。 body { text-align: center; } あまりこの方法は使用したくないのですが、前に試した事があります。 でも…テキストが全部中央寄せになってくれただけで、全体のレイアウトが中央寄せにはなってくれませんでした(泣)

関連するQ&A

  • 全体のレイアウト:中央揃えについて

    画面の全体のレイアウトを中央にそろえたいと思い、「div.Zen { margin-left: auto; margin-right: auto }」を指定してもIEでは中央揃えになっていませんでした。 ところが、「body { text-align: center }」を指定したところ、中央揃えになりました。 ブラウザで比較してみると、 ■IE7  body { text-align: center }で、中央揃え  div.Zen { margin-left: auto; margin-right: auto }では中央にならない ■Opera9.25  body { text-align: center }では、中央にならない  div.Zen { margin-left: auto; margin-right: auto }で、中央揃え ■NetScape7.1  body { text-align: center }では、中央にならない  div.Zen { margin-left: auto; margin-right: auto }で、中央揃え ■Firefox2  body { text-align: center }では、中央にならない  div.Zen { margin-left: auto; margin-right: auto }で、中央揃え と、ブラウザによって中央になる指定が違うのですが何故このようなことが起こるのでしょうか? 回答よろしくお願いします。 <?xml version="1.0" encoding="Shift-JIS" standalone="no"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja"> <head> <style type="text/css"> <!-- div.Zen { width: 900px; margin-left: auto; margin-right: auto } body { text-align: center } #Ky { float: left } div.Ku1_0 { width: 900px; height: 150px; background-color: aqua } --> </style> <title></title> </head> <body> <div class="Zen"> <div class="Ku1_0" id="Ky"></div> </div> </body> </html>

    • ベストアンサー
    • HTML
  • cssで、全体を中央寄せ、文字は左寄せにする方法

    CSSで、全体を中央寄せにしつつ、全ての文字を左寄せにする方法を教えてください。 bodyにtext-align: centerを設定し、 #outline{ width:1200px; margin-right:auto; margin-left:auto; text-align:left; } .content{ float:left; width: 1200px; } と書き、<div id="outline"><div class="content">で全体を囲みました。 すると、大方できたのですが、h要素のみずれてしまいます。 (h1は全体に対する左寄せ、h2は全体に対する中央寄せとなってしまいました・・・) h要素は色とフォントサイズを指定したのみです。 CSSについて自体あまり詳しくないので、なぜこうなってしまっているのかわかりません。 どのようにすれば、他と同じく中央左寄せにすることができるでしょうか? よろしくお願いいたします。

    • ベストアンサー
    • CSS
  • 左寄せを中央に表示できますか?

    左寄せを中央に表示できますか? 現在ホームページを作成しています。 画面で表示させると全体が左寄せで表示されています。 画面を開いたら添付の画像のようにグレーの画像を真ん中にくるよう表示させたいのですが、出来ますか? よろしくお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>安心</title> <meta name="keyword" content="," /> <meta name="discription" content="" /> <link rel="stylesheet" type="text/css" href="styles.css" media="all" /> </head> <body> <div id="top_main"> <div class="title_top"> <div id="sub_title"> <img src="images/main_top_left.jpg" width="484" height="609" alt="サブ" /> </div> <div id="main_title"> <img src="images/main_top.jpg" width="900" height="322" alt="メイン" /> </div> <div id="sub_title_b"> <img src="images/main_top_right.jpg" width="532" height="609" alt="サブ" /> </div> </div> </div> </body> </html> /* reset css */ html,body,div,h1,h2,h4,h5,h6,p,a,span,em,storng,table,tr,td,th,dl,dd,dt,object,embed,ul,li,ol,img{ margin : 0; padding : 0; /* font-family:Helvetica, "MS Pゴシック", "メイリオ", Osaka, "ヒラギノ角ゴ Pro W3", serif;*/ } a img{border : none;} div#top_main{ width:auto; } div.title_top{ width:2000px; margin:0px auto; } div#main_title{ width:900px; height:382px; position:relative; margin:0px auto; margin-top:0px; float:left; } div#sub_title{ width:484px; height:609px; position:relative; margin-top:0px; float:left; } div#sub_title_b{ width:532px; height:609px; position:relative; margin-top:0px; float:left; }

  • 左寄せにしたい

    もう自力ではどうにもできなくなったので質問させていただきます(泣) 【 CGI名 】 もっと書き込み隊2 Ver. 0.984 【 配布先URL 】 http://tackysroom.com/ 【 配布元のサポート 】・サポート掲示板はなく、メールでは、カスタマイズに関する内容は受付していないため、質問できず。 スレッド記事(及び書き込みフォーム)が中央寄せになっているのですが、 左寄せにしたいのですが、 どうにもなりません。 どこかに<center>のタグがあるのか、 もしくはcss表記するときに {margin:0 auto;}が入ってないか探してはみたいのですが、 何ともなりませんでした。 【希望する回答】 CGI初心者なので、わかりやすい回答をお願いしたく存じます。 ・ここをこう書けば左寄せになります!というダイレクトな回答をお願い致します。 URLが個人的理由で書けなくて申し訳ありません。 既に多数の書き込みのある上に非常に偏った趣味のサイトのリンクが多数書き込んであるため、 書き込んで下さった方々にも私の意向のみでご迷惑をかけるわけにもいかず。 本当に申し訳ありません。 複数ファイルがあるため、どのファイルで指定されているのかもわからず、 本当に申し訳ありません。 どなたか、回答して下さいます様、よろしくお願い致します。

    • 締切済み
    • CGI
  • ボックスを中央揃えにしたい

    先日の質問の回答ありがとうございます。 納得のいくようにできました。 全体を囲ったボックス<div id="base">を中央揃えにしたいので、 #base{ width:800px; margin-left:auto; margin-right:auto; } と書いたのですが、 FireFoxではちゃんと中央揃えされているんですが、IEではされていません。 どうすればいいんでしょうか?お願いします。 http://www.geocities.jp/totti_asroma1927/index.html http://www.geocities.jp/totti_asroma1927/css/base.css

    • ベストアンサー
    • HTML
  • IE6で表示がずれて困っています。

    IE6で表示がずれて困っています。 firefox・IE8では表示されるのに、IE6ではずれてしまいます。 質問したい事が2つあるのですが、 1つ目は インラインフレームでIE6だけサイズが大きくなる。 原因とサイズの揃え方を教えて下さいm(__)m 画像添付とソースをはります。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>無題ドキュメント</title> <link href="testcss.css" rel="stylesheet" type="text/css" /> </head> <body> <div> <p><img src="images/news.gif" width="490" height="29" /></p> <iframe src="news.html" id="newsi" frameborder="0" scrolling="auto"></iframe> </div> </body> </html> ●CSS● *{ margin: 0; padding: 0; } div{ width:490; height:200; } #newsi{ width: 486px; height: 150px; border: 2px #F96 solid; } --------------------------------------------------------- 一つ目は以上です。 二つ目もここにで質問したかったのですが、文字数が足りないためもう一度質問させていただきますm(__)m 初心者でわからない事が多いため、できるだけ詳しく教えて下さい。 宜しくお願いいたしますm(__)m

    • ベストアンサー
    • HTML
  • IE6 IE7で文字が潰れる 高さがでない・・・

    お世話になります。 各ブラウザで表示確認をしていたら問題がみつかりましたので、 質問させていただきます。 IE6,IE7において、文字の高さがつぶれてしまって表示できていないようです・・・。 なにかcssでの指定が足りないのでしょうか? 原因と解決策ございましたら、よろしくお願いします。 h2{ color:#222222; text-align:center; font-size:154%; font-weight:bold; border-bottom:2px solid #222222; padding-bottom:5px; margin-bottom:10px; } デフォルトcssはyuiのリセットcssでリセットしております。 cssとスクリーンショットを載せておきます。 画像は上がIE8などでちゃんと表示されているもので、 下がIE6とIE7での表示です。

    • ベストアンサー
    • CSS
  • cssがIEだけ正常動作しない。

    cssがIEだけ正常動作しない。 一生懸命ショッピングサイトを作りました。 http://strawberryjam.co/ マックやファイヤフォックス、サファリは正常に動作しますが WindowsのIEのみ画面最上部のロゴなどヘッダー全体が異常です。 リンクを張っている画像にマウスを持って行くとIEの場合のみレイアウトが崩れます。 なぜこうなるのかCSSも見るのですが、見当がつきません。 回避策、解決策いただけますと有難いです。

  • div記述方法について

    よろしくお願いします。 cssに以下のように記述をしました。 div#border {width: 800px; margin-left: auto; margin-right: auto; border: 1px solid #000000; padding: 10px 10px 10px 20px; background-color: #ffffff; } 出来た枠の中に文字や画像を入れていっているのですが、その文字や画像は、それぞれ左寄せにしたり、画像は中央揃えにしたりしています それは、問題無いと思うのですがFire Foxで見ると外側に作成した枠そのものが、中央に寄って表示されるのですがIEで見ると枠そのものが 左に寄ってしまいます。 Fire Foxでの表示が正しいようですが、IEでも枠が中央に表示させる事は出来ないのでしょうか? 私はdiv#borderにtext-align: centerを記述したところ枠の中の文字から左寄せに表示したい画像まで中央に寄ってしまいました。これでは私の考えている内容では無いためtext-align: centerの記述は削除しました。 初心者では御座いますがご指導の程よろしくお願い致します。

    • ベストアンサー
    • HTML
  • IEのみgoogleキャッシュでの表示がずれる

    ホームページ制作初心者です。 初めてホームページ(xhtml+css)を自作し、無事、検索にも引っ掛かるようになったのですが、ひとつスッキリしない点があります。 コンテンツ全体を幅指定し、左右のマージンをautoにして中央寄せにしてあるのですが、何故かgoogleキャッシュでそのページを開くと左寄せになってしまいます。 自力で何とかしようといろいろ試しつつ、クロールされる度に確認していますが、改善しません。 また、IE(6.0、7.0)のみの現象で、fire foxとoperaでは同じキャッシュでも意図通りに中央寄せで表示されており、さっぱり原因が分からず、困りはてています。 ちなみに、 ・クロールされた際に新たに変更したcssを読んでもらえるように、htmlでは「***.css?任意の数字」としています。 ・念のため、Another HTML-lint gatewayでのhtmlの文法チェックは100点が出るようにしています。 どうにか解決したいのですが・・。 よろしくお願します。