- ベストアンサー
CSSでの中央寄せにかんする疑問
.main { margin:0 auto; width:1000px; } とCSSファイルに記述することにより中央よせをしようとしています。 IE8以外のブラウザでは中央に寄るのですが、IE8では実現しません。 実はこのCSSの記述は私が以前作成したサイトからコピーしていて、そのサイトではすべてのブラウザで中央に寄っています。 今回作成したサイトではこのようなトラブルに陥りました。 で、苦し紛れでDOCTYPE宣言を <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> から <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> に変更したらIE8でも中央に寄りました。 なぜ、このようなことになったのでしょうか？ 教えてください。 よろしくお願いします。(Apacheのバージョンとかがかかわっている？)
- eccschool
- お礼率8% (53/644)
- HTML
- 回答数4
- ありがとう数0
- みんなの回答 （4）
- 専門家の回答
質問者が選んだベストアンサー
単純にIE8のレタリング方法が変わっただけです。 IE8には３つのレタリング方法があります。 * IE8 標準モード：CSS2.1の勧告に沿ったもの。 * 互換モード ：IE6以前のモード * IE7 標準モード：IE7のモード DOCTYPEがXTHML1.0だとIE8モードになるので中央寄せが適用されたわけですね。 ちなみに、DOCTYPEを変更せずとも、meta属性でモード指定できます。 詳細は参考URLをご覧ください。
その他の回答 (3)
- aegills
- ベストアンサー率70% (7/10)
#3です。 Apacheの件に触れていませんでしたので、追記します。 モードの指定はサーバサイドでも可能ですので、 サーバが違うと動作が異なるかも知れません。 詳細は#3の参照URLにありますので、ご確認ください。
- abril
- ベストアンサー率69% (388/560)
【質問番号：5236396】で回答させて頂いた者です。 > なぜ、このようなことになったのでしょうか？教えてください。 えーと…あちらの回答で参考としてあげたコンテンツ順を追って読んで行けば、理解できる筈なんですが。一通り読んでいただけましたでしょうか？だとしたら、どこがどの様にわからなかったのでしょう？ > (Apacheのバージョンとかがかかわっている？) 無関係です。UAの問題ですから。 それから、確かにあちらの回答で「DOCTYPEを変えられる様なら、（IE8が標準準拠モードで挙動するものに）変えてしまった方が良いでしょう。」とは言いましたが、 > で、苦し紛れでDOCTYPE宣言を > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> > から > <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> > に変更したらIE8でも中央に寄りました。 「苦し紛れ」でただ単にDOCTYPE宣言を変えただけではダメです。まして、上記のケースだとHTMLからXHTMLに変更していますから、文法が変わってくる為、HTMLの他の部分の記述の変更も余儀なくされます。 例えば、XHTMLでは「空要素（閉じタグのないタグ）は閉じていなければならない」というルールがありますから、<br>/<hr>/<img>/<meta>/<input>などは、<br />といった記述に変更しなければならなくなります。 また、こういった表面上の記述変更だけではなく、それぞれのDOCTYPE宣言毎に「推奨・非推奨・廃止」のタグが異なります。 そういった事も含めて全て変更対応が可能な状況ですか？今からサイトを作り始めた状態なら可能だとは思いますが、例えば既存のサイトのメンテナンスだったり、システムで自動生成されているものだったりすると、事情によりソースの細部まで変えたくても変えられない場合もあるかと思いますので。
- salonpath
- ベストアンサー率48% (194/399)
DOCTYPE宣言の記述によって、過去のブラウザのレンダリングを行うモード ( 後方互換モード ) と、w3cの仕様に基づいたレンダリングを行うモード ( 標準準拠モード ) を切り替えることができるDOCTYPEスイッチというものがあります。 以下のサイトで詳しくまとめられています http://w3g.jp/others/data/doctype_switching
関連するQ&A
- IEでCSSの中央寄せが効かない
common.cssという外部CSSファイルで .main{ width:800px; margin:0 auto; } としています。 HTMLを簡単に書くと <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" > <title>test</title> <meta content="text/javascript" http-equiv="Content-Script-Type"> <link media="all" type="text/css" rel="stylesheet" href="css/common.css"> </head> <body> <div class="main"> ここに中央寄せになった記述 </div> </body> </html> としています。 firefoxでは中央寄せになりますが、IE8では中央によりません。 どのようにしたら良いでしょうか？
- ベストアンサー
- HTML
- ＤＯＣＴＹＰＥ宣言は厳密に気にするべきか？？
現在ＷＥＢを独学で学んでおります。 そこでＤＯＣＴＹＰＥ宣言についていくつか疑問に思いました。 ひとつでもわかる方はご回答頂ければ幸いです。 １．<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> と、ソースの頭に記述しておいて <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> の内容で記述(XHTML 1.0 Transitionalで記述)することは可能ですか？？ つまり、HTML 4.01 Transitionalを宣言して終了タグなど、XHTML 1.0 Transitionalの方式で書いても正確に表示されるかを知りたく思って おります。 ２．ＤＯＣＴＹＰＥ宣言を書いてないサイトが多く見受けられますが、 この場合はどのようにＤＯＣＴＹＰＥ宣言と捉えられるのでしょうか？ また、この場合のデメリットとかはありますでしょうか？？ 以上、わかる方いましたらよろしくお願いいたします。
- ベストアンサー
- HTML
- Unicodeでサイトを作るとCSSがおかしくなるのですが…
Shift-JISで作成したサイトの文字コードをUnicode（UTF-8）に変更しました。そのページをIE6で閲覧してみると、外部CSSで設定したテーブルのセルの背景色が無効になってしまいます。また、line-heightの値もおかしくなります。Firefoxでは問題がないのですが、これはIEのバグなのでしょうか？それとも、Unicodeに限っての何かがあるのでしょうか？ 当方win2000です。DOCTYPEは以下で制作しました。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- ベストアンサー
- CSS
- iモードとCSS
お世話になっております。 いろいろ検索して携帯サイトをXHTML+CSSで作り始めました。 決め手はdocomoがインラインではありますが「CSSに対応している」という記述を見つけたからです。 数ページ作り、ソフトバンクではバッチリです。 たぶんAUも大丈夫だろうと思います。 問題はdocomoで、「iモードHTMLシミュレーターII」で確認すると、CSSがまったく付いてません・・・ショックです。 ■インラインCSSが使えるというのはガセ？ ■シミュレーターがいい加減？ ■何か間違ってる？（DTD？） ■docomoがXHTMLに対応している意味は・・・？ どなたか詳しい方よろしくお願いします。 それと、DTDは下記を使用しており、 ソフトバンクは問題ありません。AUも。docomoでは？関係ありますか？ <!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"> よろしくお願いします。
- 締切済み
- HTML
- ホームページをブラウザの中央に表示したい
作成したＨＰをブラウザの中央に表示したいのですが 現在は左寄せで表示されてしまいます。 ご存じの方がいらっしゃたら教えてください。 作成ソフトはホームページビルダー１３で、 どこでも配置モードです。 DCCTYPEの設定は以下の内容に変更しております。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- 締切済み
- HTML
- CSSレイアウトでの中央寄せ
おせわになります。 bodyに背景画像を指定し、CSSで中央寄せをしているのですが、 動作確認でブラウザ幅をこまかく拡大・縮小を繰り返すと、 背景画像とコンテンツ部とが1pxずれる事があります。 Win IE6.0、7.0、MacOSX safari2.0でこの現象がおき、FF2.0はWin&Macともに問題ありません。 この解決方法はありますでしょうか。 ご教授のほど、よろしくお願いいたします。 ▼HTML <!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="Content-Type" content="text/html; charset=shift_jis" /> <title>テスト</title> <style type="text/css"> <!-- body { margin:0; padding:0; text-align:center; background: url(http://www.geocities.jp/ajax3210/bg.gif) center top repeat-y; } #wrapper { width:746px; height:100px; background-color: #CCCCCC; margin-left:auto; margin-right:auto; text-align:left; } p { margin:0; padding:0; } --> </style> </head> <body> <div id="wrapper"> <p>テスト</p> </div> </body> </html>
- ベストアンサー
- HTML
- XHTML 1.0 Transitional でインラインフレームの表示方法
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> でインラインフレームを表示する方法はありますか？ 普段は <DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">のドキュメントタイプでサイトを作っているのですが、他の人に作ってもらったサイトが上記のタイプで作られていました。そのサイトにiframeを組み込みたいのですが、表示がされませんでした。そこで、HTML 4.01 のタイプに変更したところ、文字の大きさや高さなどが崩れてしまいます。何かよい方法がありましたら教えてください。宜しくお願いします。
- ベストアンサー
- HTML
- ＩＥとＩＥ以外のブラウザで表示内容を変えたい
初めて質問させていただきます。情報に不足があったらすみません。 追加表示させていただきます。 色々調べましたが、Ｊａｖａｓｃｒｉｐｔで、どうしても、実現できないので、 どなたか、ご教授いただけませんでしょうか・・・。 ＸＨＴＭＬのファイルだと、ＩＥだとちゃんと表示されないので、 ＩＥとＩＥ以外のブラウザで下記のようにリンク先ファイルの種類をかえたいとおもっています。 (1)ＩＥ以外 ： A.html これは → <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> (2)ＩＥ ：B.html これは→ <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> クリックするとリンク先が開くヘルプファイルのようなものなのですが、 ブラウザによって、クリックしたときに開くＨＴＭＬファイルを変えたいのですが 可能でしょうか・・・。 色々調べましたがどうしてもわかりませんでした。 どなたかご教授いただけたら、本当にとてもありがたいです。 どうぞよろしくお願いします。
- ベストアンサー
- JavaScript
- ie6で画像のpaddingを表示させたい
seesaaブログユーザーです。 seesaaはxhtmlで記述しているようでソースの先頭は 1:<?xml version="1.0" encoding="Shift_JIS"?> 2:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> (1:は一行目, 2:は二行目であることを表しています) のようになっています。 これを 1:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> もしくは 1:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2:<?xml version="1.0" encoding="Shift_JIS"?> としても問題ないのでしょうか？ と、質問させていただいた理由は 画像に枠をつけたいと思って、cssでimgにpaddingを指定したのですが ie6では表示されないのでこれを何とかしたいからです。 http://www.koikikukan.com/archives/2006/03/11-015552.php の記事を参照してわかったのですが、 この状態ですと画像のpaddingがie6では適用できないのですね。 そこで、記事にあるようにdoctype宣言を先頭に持っていくと ie6でも表示されるようになりました。 ということで、 「<?xml version="1.0" encoding="Shift_JIS"?>」 の扱いについて質問させていただきます。
- ベストアンサー
- XML
- XHTMLについての疑問
XHTMLとCSSを利用してサイトを制作しています。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 最終段階になり下記のコードをHTMLファイルの先頭に追加しました。 宜しくお願いします。 <?xml version="1.0" encoding="shift_jis"?> IE6で確認すると文字サイズが上記コードを追加する前と比べると大きくなっています。 これは正常でしょうかそれともバグでしょうか。 また回避する方法はあるんでしょうか。 お教えください。 ちなみにCSSファイルには下記のように文字サイズを指定しています。 font-size: small;
- ベストアンサー
- その他([技術者向] コンピューター)
