爲什麼固定位置搞亂了我的路線？

我試圖保持標題仍然有其餘的內容滾動下面。我能夠實現這一點，但是當我在我的兩個頭部div上放置一個固定位置時，會突出margin margin 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

在容器DIV只需使用position: fixed，不使用它兩次

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還希望將margin-top：80px添加到.structure，以便固定標題不會與其重疊。 –

@ChrisHerbert ya我對他的期望很高......並且我不明白固定div如何打破他的佈局 –

填充頂部：80工作完美。 – LightningWrist

爲什麼固定位置搞亂了我的路線？

回答

相關問題