1

100％幅で問題が発生しているようです。比較的配置された3つのdiv、ヘッダー、コンテンツ、フッターがあります。ヘッダーに600pxの幅を設定し、コンテンツとフッターに100％の幅を設定しました。ただし、水平スクロールバーを使用しているときにブラウザのサイズを変更すると、100％幅のdivが切り取られ、600pxのdivに一致するように完全に移動しません...これを修正するにはどうすればよいですか？

CSS

#header {
    position: relative;
    width: 620px;
}

#content, #footer {
    position: relative;
    width: 100%;
}

HTML

<div id="header"></div>
<div id="content"></div>
<div id="footer"></div>
4

2 に答える 2

3 
<div id = "container">
    <div id="header"></div>
    <div id="content"></div>
    <div id="footer"></div>
</div>


#container {min-width:620px;}

例を参照してください：http：//jsfiddle.net/calder12/xN2PV/3/

注意点。min-widthはIE6ではサポートされていません。これが重要だとは思えません。もしそうなら、別の解決策が必要になるでしょう。

于 2013-01-03T15:11:33.727 に答える
1

#contentと#footerの幅を「auto」に設定します。ブロック要素であるDivは、直接の親要素で使用可能な幅の100％（設定されている場合はマージンなし）を自動的に消費します。

そのため、＃contentと#footerが#headerまたはその他の明示的なサイズの要素に含まれている場合、指定された幅より広くなることはありません。

于 2013-01-03T15:12:23.373 に答える