固定位置が私の位置合わせを乱しているのはなぜですか？

私はまだヘッダを保持し、残りの内容をその下にスクロールさせようとしています。私はこれを達成することができますが、私は私の2つのヘッダーdivsに固定位置を置くときに余白autoの中断を出します。固定位置が私の位置合わせを乱しているのはなぜですか？

CSS：

.structure { 
    width:960px; 
    padding:20px; 
    margin:0px auto 0px auto; 
    background:#121212; 
    border-left:5px #F06BA8 solid; 
    border-right:5px #F06BA8 solid; 
} 
.header_home_structure { 
    width:960px; 
    margin:0px auto 0px auto; 
    position:fixed; 
    height:80px; 
} 
.header_home_bg { 
    width:100%; 
    background:#121212; 
    border-bottom:3px #F06BA8 solid; 
    height:80px; 
    position:fixed; 
}

HTML：

<body> 
    <div class="header_home_bg clearfix"> 
     <div class="header_home_structure clearfix"> 
      </div> 
     </div> 
    <div class="structure clearfix"> 
    </div> 
</body>

出典

2012-12-19 LightningWrist

2回だけ

Demo

.structure { 
    width:960px; 
    padding:20px; 
    margin:0px auto 0px auto; 
    background:#121212; 
    border-left:5px #F06BA8 solid; 
    border-right:5px #F06BA8 solid; 
} 
.header_home_structure { 
    width:960px; 
    margin:0px auto 0px auto; 
    height:80px; 
} 
.header_home_bg { 
    width:100%; 
    background:#121212; 
    border-bottom:3px #F06BA8 solid; 
    height:80px; 
    position:fixed; 
}

出典

2012-12-19 06:06:56

彼はprobabますそれを使用しないでください、コンテナのdivにposition: fixedを使用固定ヘッダーが重複しないようにmargin-top：80pxを.structureに追加したい場合もあります。 –

@ChrisHerbert ya私は彼から多くのことを期待しています。また、良い点よりも、固定ディビジョンが彼のレイアウトをどのように破ることができないのか分かりません。 –

パディングトップ：80は完璧に機能しました。 – LightningWrist

固定位置が私の位置合わせを乱しているのはなぜですか？

答えて

関連する問題