内側にdivを含むソリッドカラーヘッダーを作成

これは私が目指しているもので、Firefox 7で100％正しく動作します。私はIE 8で開き内側にdivを含むソリッドカラーヘッダーを作成

enter image description here

が、それはこのように表示されます。内部のすべての要素で

<div id="header-home"> 
    <div id="header-content"> 
    </div> 
</div>

：ここ

enter image description here

は、基本的なレイアウトです #header-content。

ここには、JSFiddleでホストされる関連するHTMLとCSSがあります。プレビューパネルを引き伸ばすと、内容がFirefox上で正しく中央に表示されます。

http://jsfiddle.net/stapiagutierrez/agURs/

それが必要としてなぜIEはdiv要素を中心にされていませんか？

出典

2011-10-27 Only Bolivian Here

あなたは私たちに完全なコードを表示することができますか？「margin：auto」が機能しない理由の1つは、doctypeを持っていないか、間違っているということです。 –

@AlexeyIvanovコード全体がJSFiddleのリンクにあります。私はdoctypeが不足していることに気付きました。それでは私は何を使うべきですか？なぜIEは非常にニッキーなのですか？： –

さて、あなたはxhtmlを使用していますので、JSFiddleにxhtmlを追加しました。これで試してみてください：http://jsfiddle.net/agurs/1/ –

あなたのhtmlにdoctypeを持っていない場合、IEは奇妙なモードに落ちます。そしてクォークモードマージンオートで;動作しませんでした。

doctypeを追加することでそれを解決できます。

<?xml version="1" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

しかし、あなたはDOCTYPE行の前にXMLラインを配置する場合、IEはそれを受け入れることはありません：XHTML（そうXML-読者はそれがXMLであることを理解することができますし、それを解析することができます）のための

右DOCTYPEとヘッダがあります（doctypeは常にドキュメントの最初の行だと思うので）。だから、あなたが書く必要があります、それはIEで動作させるために：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<?xml version="1" encoding="UTF-8"?>

かだけを：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

出典

2011-10-27 13:50:21

margin:0 autoを#header-contentに入れてみてください。

出典

2011-10-27 13:43:01 MCSI

内側にdivを含むソリッドカラーヘッダーを作成

答えて

関連する問題