• 締切済み

Netscape7.1のセンタリング

今、個人でWEBサイトを制作しています。 * { text-align: left; } body { text-align: center; } のようにし、 コンテンツ部を真ん中に配置しようとしているのですが、 Netscape7.1では左に来てしまいます。 調べてみたところ、どうやら Netscapeのバグではなく、InternetExplorerのバグらしいのですが、 それ以上はよくわかりませんでした。 解決策として、どのようなものがあるか 教えてもらえればうれしいです。 ちなみに、 言語はXHTML1.0 Strictで制作しています。

  • CSS
  • 回答数4
  • ありがとう数0

みんなの回答

noname#23734
noname#23734
回答No.4

XHTMLは、文字コードをUTF-8 または UTF-16 にするとxml宣言が必須ではなくなるのではないでしょうか。 そうすると<!DOCTYPEからはじめることができるのでdocument.compatModeの値がCSS1Compatを返すことになりIE6で横幅を指定したブロック要素をmargin:autoでセンタリングできると思います。 試したことがないのでjavascriptでdocument.compatModeをアラートして確認してみてください。 javascriptでも良いのでしたらCSSを2つ用意してブラウザ毎にCSSを切りかえることもできます。

  • 345itati
  • ベストアンサー率48% (795/1639)
回答No.3

body { margin-left: auto; margin-right: auto; } でセンタリングされるのが正しい解釈かと。 IEでtext-aligin: center;でなければセンタリングされないのは後方互換モードにおけるバグかと。(標準準拠モードではセンタリング出来たはず) XHTMLだと、最初に文字コードの宣言を入れるとIE6では互換モードに強制的になってしまうバグがあったので、それも関係しているのでは? ちなみにNetscapeはWinでは8.1.2が出ております(英語版のみ)。Netscapeで確認されるなら、こちらを視野に入れられる方がよろしいかと。 →http://browser.netscape.com/ns8/ 個人的に、使い勝手は悪くありません。

  • MAN_MA_RUI
  • ベストアンサー率41% (426/1024)
回答No.2

fenrirsさん、こんばんは^^ Netscape 7.1でも動作確認をすることはすばらしいですが、Netscape 7.1をサイトの推奨利用環境に入れないようにしてくださいね。 リリースされてからもう3年くらい放置されています。 3年分の未修正セキュリティホールを抱えた環境での閲覧は、高確率ではなくとも何かあったとき大変です。 使うならばNetscapeから派生したMozilla Firefoxあたりがお勧めかな? ただ、Netscape 7.1に対応出来るサイトはそれ以降の同系列ブラウザでも正しく表示できる可能性が高くなります。 ほとんど横道にそれたアドバイスとなりますが、何かの参考になれば幸いです。

  • steel_gray
  • ベストアンサー率66% (1052/1578)
回答No.1

http://www.mozilla.gr.jp/standards/webtips0004.html こちらが参考になると思います。

関連するQ&A

  • cssでメインコンテンツをセンタリングする方法

    cssでメインコンテンツをセンタリングする方法に関する質問をお願いいたします。 下記のサイトなどをみると、 http://www.css-lecture.com/log/css-beginner/026.html *xhtml <body> <div id="wrapper"> <h1>サイト全体を中央に配置にする</h1> <p>サイト全体を中央に配置にする為のテキスト</p> <!--/ #wrapper--></div> </body> *css body { text-align: center; } div#wrapper { width: 800px; margin: 0 auto; text-align: left; border: 1px solid #FF0000; } (1)「body」においてもセンタリングを行っているいるのですが、 それはどうしてでしょうか。 「div#wrapper」だけのセンタリングでは不十分なのでしょうか? > body { text-align: center; } > (2)また、「p」などのインライン要素は { text-align: center; } を使い、 「id」などのブロック要素は { margin: 0 auto; text-align: left; } を使いますすが、 body要素に対しても、 { text-align: center; } とすることが出来るのでしょうか? (3)あと、「div#wrappe」で囲ったブロックの中の 「p」や「id」で囲ったコンテンツの中身のテキストは 「div#wrapper」の「 text-align: left; 」で 全て左寄せになりますか? 参考書などを見ても解りづらかったので 教えていただきたくお願い致します。m(_ _)m その他参考URL: http://detail.chiebukuro.yahoo.co.jp/qa/question_detail/q1010809440

    • ベストアンサー
    • CSS
  • CSSで全体をセンタリングしたい

    navi address main footer ↑このような4つの<div>をさらにcoverという<div>でくるんだ?レイアウトにしました。 下記のようなCSSにしたのですが、中央にすることができません。 同じような質問もたくさんあり、拝見したのですがどうもうまくいきません。 coverという<div>を作ったのが間違いなのでしょうか? ------------------------------------------- body{ text-align:center; } #cover{ width: 800px; margin-right=:auto; margin-left=:auto; text-align:left; } #navi{ float: left; width: 565px; height: 165px; } #address{ float: right; text-align: left; width: 235px; } #main{ width: 500px; clear:both; padding-right: 150px; padding-left: 150px; font-size: 10px; text-align: left; line-height: 20px; } #footer{ width: 500px; text-align:center; padding-right: 150px; padding-left: 150px; padding-top: 30px; } -------------------------------------------

    • ベストアンサー
    • CSS
  • CSSのセンタリングが、「div」で何故か出来ない

    下記のアドレスのホームページについてです。 http://sky.geocities.jp/thanksv0358/index.html# HTMLで、 <body> <div id="main"> ~ </div> </body> とし、CSSで #main{ text-align:center; margin-left:auto; margin-right:auto; text-align:left; } としたにもかかわらず、何故かセンタリングができません。 今回、最初の<!DOCTYPE~の部分から全部、自分で書いてみました。 詳しい方がいましたら、よろしくお願いします。

  • Netscape7.1 での表示方法を教えてください。

    初めまして。 現在ホームページを作成中なのですが、以下のソースでページを表示しようとすると、 Netscape7.1だけ正しく表示されません。素人考えなのですがNetscapeではテーブル タグのheight="%"が無視されているように思えます。Netscapeで正しく表示される方 法をお教え下さると幸いです。よろしくお願い致します。 <html> <head> </head> <body bgcolor="#ffffff" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <div style="text-align:center"> <table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0" style="margin:auto;text-align:left"> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> <tr> <td align="left" valign="top"> <iframe name="contents" src="a.html" width="100%" height="100%" style="border:solid 0pt;border-color:#000000;" scrolling="no" frameborder="0" allowtransparency="true"></iframe></td> </tr> <tr> <td height="6%" align="center" valign="center" bgcolor="#000000"></td> </tr> </table> </div> </body> </html>

    • ベストアンサー
    • HTML
  • xhtml+cssのレイアウト センタリング カラム落ち

    xhtml+cssレイアウト超初心者です。 何か間違っている所があれば教えてください。 よろしくお願い致します。 【問題点】  1)全体がセンタリングにならない    □□■■■■■□□    □□■■■■■□□    □□■■■■■□□(左右の中央にしたい)  2)subがカラム落ちしてしまっている?    mainとsubの下に『スト』という文字が入ってしまっています。 【cssソース】 @charset "Shift_JIS"; * {margin: 0;  padding: 0;  } body {color: #000000;  font-size: 62.5%;  } /*==wrapper==*/ div#wrapper { width: 950px; margin : 0 auto; } /*==heaber==*/ div#heaber { width: 950px; margin-bottom: 30px; background-color: #66CCFF; } /*==contents ==*/ div#contents { width: 950px; float: left; background-color:#66CCFF; } /*==main ==*/ div#main { width: 740px; margin-right: 20px; float: left; background-color:#6699FF; } /*==sub ==*/ div#sub { width: 190px; float: left; background-color:#6666FF; } /*==siteinfo ==*/ div#siteinfo { clear: both; width: 950px; background-color:#6633FF; } 【HTMLソース】 <?xml version="1.0" encoding="Shift_JIS"?> <!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" lang="ja" xml:lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS" /> <link rel="stylesheet" media="tv, screen, projection, print" href="css/import.css" /> </head> <body> <div id="wrapper"> <div id="header"> <p>テキスト</p> <p>テキスト</p> </div><!--/header--> <div id="contents"> <div id="main"> <p>テキスト</p> <p>テキスト</p> </div><!--/main--> <div id="sub"> <p>テキスト</p> <p>テキスト</p> </div><!--/sub--> </div><!--/contents--> <div id="siteinfo"> <p>テキスト</p> <p>テキスト</p> </div><!--/siteinfo--> </div><!--/wrapper--> </body> </html>

    • ベストアンサー
    • HTML
  • cssのことでわからないことがあります。

    こんにちわ。 私はFC2ブログを使って自作テンプレートを作っているのですが、テーブルで組んだ一つのコンテンツを真ん中に配置したいのですが、cssでmargin-raight:auto、margin-left:auto;にしても真ん中に配置されません。 margin-left:300px;と入力すれば左に300pxの余白を作ることはできるのですが・・・ 何故なんでしょう? 後HTML上で<div align="center">~</div> で囲むと真ん中に配置されます。 私としてはcssでレイアウト全てを管理したいのでお願い致します。

  • 3段組みを中央に配置したい

    3段組の配置で行き詰っております。 お解かりの方がいらっしゃいましたら、お手数でもご回答をお願い申し上げます。 XHTMLで3段組のHPを作成したいのですが、どうしても、リキッド表示になり困っております。 目標は、750pxで中央に配置したいのです。 3段組みの構成は、 左側に「navigation」 真ん中に「photo」 右側に「contents」 「photo」と「contents」をcontainerとしてfloat: right;を使用しておりますが、うまくいきません。 containerが画面のサイズに合わせて右端を基点に動きます。 YAHOOのサイトのように常に中央に配置したいのですが、どうしたら良いでしょうか。 ちなみに、ヘッダーとフッターについては body { text-align:center; } で中央に配置されております。 重ねてお願い申し上げます。

  • CSSレイアウトについて

    cssによる3カラムを作っているのですがie6で見ると右のカラムが 落ちしてしまいます。 ie6のバグのようでdisplay: inline;を使うなどいろいろと試して みたのですがwidthとmarginの合計で1000px以内にしなければ ならないようなのですがその場合firefoxなどのブラウザで確認 すると若干ではありますが微妙に違いがでてきます。 下記のソースのように特に画像をいれなくてもbackgroundを設定 することによりカラム落ちはしなくなったのですがこの他に解決 方法はあるのでしょうか? また、なぜbackgroundを設定することにより解決したのかも 全く意味不明なのでご存知の方がおりましたら教えてください。 #contents { width: 1000px; } #left { display: inline; float: left; width: 180px; text-align: left; background: url(); } #center { display: inline; float: left; width: 600px; margin: 0 20px; text-align: left; background: url(); } #right { display: inline; float: left; width: 180px; text-align: left; background: url(); } <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> ~略~ <div id="contents"> <div id="left">レフト</div> <div id="center">センター</div> <div id="right">ライト</div> </div> ~略~

    • ベストアンサー
    • CSS
  • bodyのセンタリングとwidthの指定について

    スタイルシートで以下のように指定しbodyをセンタリングします。 -----CCS----- html{text-align:center;} html,body{height:100%;} body{ margin:0px auto; width:580px; text-align:left; } -----HTML4.01 strict----- <html> : <body> <h1>・・・</h1> <ul>・・・</ul> <h2>・・・</h2> <p>・・・ <h2>・・・</h2> <p>・・・ ---------- これをwin IE6で確認すると、h2以下の内容がbodyの外(画面100%の直下)にはみ出します。 win Safari5でも同様です。 IE6では、body直下にコンテナとしてdivを置きwidthを指定してやれば解決します。 Safari5ではbody直下にコンテナとしてdivを置くだけで解決します。 なぜこのような現象が起きるのでしょうか? htmlにtext-alignを指定したりbodyを直接センタリングしているので不安は少々あるのですが…。 h2以下が下がる原因としてh1とulとの相違点(margin-topの指定や文字センタリング)を確認し修正してみたりしましたが解決はしませんでした。 なお、フロートや固定などの表示方法は指定していません。 原因を推察できる方、ぜひ回答お願いいたします。 こういった指定をしていないか、など上記の記述が足りなければご指摘ください。

    • ベストアンサー
    • HTML
  • WinIE6でだけレイアウトが壊れる。xhtml strict

    XHTML 1.0 Strictで宣言してサイトを制作しています。 ソフトはテキストエディタです。 FirefoxやNetscape、Operaでは正しく表示されるのに WinIE6(IE5以下はテストしていません)では レイアウトが壊れてしまいます。 (ハックは、何もしていません。) 特に、 li要素をfloat:left;させた部分が必ず崩れ、 横一列に整列しません。 マージンやパディングの問題かと思い 色々さわってみましたが解決していません。 IE6でもハックが必要なのでしょうか?(または他の問題?) これだけの情報ですが、よろしくお願いいたします。

専門家に質問してみよう