2011-01-17 7 views
0

私はAdobe Fireworks Cs5でビルドしているページのCSSを生成しました。ヘッダーと他のdivの全幅を設定する方法が不思議です。ヘッダーセクションまでのCSSコードが表示されます。Css全角質問

@charset "utf-8"; 

body { 
background-color: #fff; 
font-size: 62.5%; 
margin: 0; 
padding: 0; 
} 
body * { 
font-size: 100%; 
} 
h1, h2, h3, h4, h5, h6 { 
font-weight: normal; 
} 
p { 
margin-bottom: 1.1em; 
margin-top: 0; 
} 
#main p.lastNode { 
margin-bottom: 0; 
} 
a:link img, a:visited img { 
border: none; 
} 
div.clearFloat { 
clear: both; 
font-size: 0; 
height: 0; 
line-height: 0px; 
} 
li.clearFloat { 
clear: both; 
} 
ul.symbolList { 
display: inline; 
float: left; 
list-style-type: none; 
margin: 0; 
padding: 0; 
} 
.AbsWrap { 
position: relative; 
width: 100%; 
} 
.rowWrap { 
width: 100%; 
} 
#main { 
margin: 0 auto 0 0; 
width: 960px; 
} 
#Div { 
    position:absolute; 
margin-left: 0px; 
margin-top: 0px; 
display: inline; 
float: left; 
margin-bottom: 0; 
background-color: #333; 
width: 960px; 
margin-left:-480px; 
    left:50%; 
padding-top: 0px; 
height: 849px; 
} 
html > body #Div { 
height: auto; 
min-height: 850px; 
} 
#Div2 { 
    /* This is the Header*/ 
margin-left: 0px; 
margin-top: 0px; 
display: inline; 
float: left; 
margin-bottom: 0; 
background-color: #300; 
width: 960px; 
padding-top: 0px; 
height: 99px; 
} 
html > body #Div2 { 
height: auto; 
min-height: 100px; 
} 
+0

ヘッダー要素をブラウザの幅の100%に設定する方法を尋ねていますか? – jessegavin

+0

私は幅を試しました:幅の100%と失敗しました。 – Gandalf

答えて

0

divなどのブロックレベルの要素は、他の要素の内側に含まれていないか、または別の場所に配置されている場合は常に全幅です。あなたの場合、幅を設定せずにいくつかの要素を絶対に配置したように見えます。これにより、コンテンツがない限りdivが崩壊する可能性があります。また、パーセントを使用して幅を設定する場合は、親のパーセントであることを常に覚えておいてください。親は任意の単位サイズに設定されていますか?次へ#DIV2で

0

変更displayプロパティ:

#Div2 { 
... 
display: block; 
... 
} 

これは、ヘッダーのdiv(#DIV2)コンテナのdiv(両方とも960ピクセル幅の広い)の全幅になります。

#Div1の同じプロパティも変更します。

+0

ありがとう、それは完全に働いた。 – Gandalf