絕對CSS位置並不在IE7

工作

我有以下簡單的腳本，但它不能在IE7絕對CSS位置並不在IE7

<div id="content"> 
    <div id="left"></div> 
    <div id="right"></div> 
    <div id="bottom_menus">any text here...</div> 
</div>

和CSS工作

#content 
{ 
    margin: 0 auto; 
    padding: 0; 
    width: 980px; 
    background-color: lime; 
    height: 800px; 
    overflow: hidden; 
    position: relative; 
} 
#left 
{ 
    width: 275px; 
    float: left; 
    background-color: olive; 
    margin: 0px 0px -5000px 0; 
    padding: 0 0 5000px 0; 
    min-height: 400px; 
} 
#right 
{ 
    width: 704px; 
    float: left; 
    background-color: red; 
    margin: 0px 0px -5000px 0; 
    padding: 0 0 5000px 0; 
    min-height: 400px; 
} 
#bottom_menus 
{ 
    background-color: orange; 
    height: 15px; 
    position: absolute; 
    bottom: 0px; 
    width: 100%; 
}

爲什麼絕對位置不起作用？在此先感謝

來源

2010-04-01 Simon

無關，但你爲什麼要將'＃left'和'＃right'的邊距設置爲'-5000px'，並將每個邊距設置爲'5000px'？ – 2010-04-01 20:12:09

你的意思是什麼不起作用？當然，你需要一個絕對位置的左側和頂部屬性。 – 2010-04-01 20:16:03

@Jeff Rupert它是這樣的，我怎樣才能讓左和右divs一樣高，這等於max {heigth（left），heigth（right）}。 – Simon 2010-04-01 20:17:31

您還沒有指定左邊，所以它的默認值爲0px;由於您的框上有-5000像素的邊距，我猜它正在工作，而bottom_menus div離開屏幕左側。絕對定位將忽略其父容器的填充。嘗試設置left：5000px，假設您需要負餘量和正填充。你想用這個來完成什麼？

來源

2010-04-01 20:18:08 Tom

5000px的邊距和填充僅適用於容器的底部，因此理論上它將位於容器下方4985px處，由其溢出選項隱藏。 – animuson 2010-04-01 20:21:06

@Tom我需要在右側容器的底部有#bottom菜單，所以我使用-margins和絕對定位...以及一個問題，難道你不知道爲什麼我們所有的gravatars都變成了馬：DDD – Simon 2010-04-01 20:24:32

對於絕對位置的工作，你必須指定兩個方向：例如。 top & left，或者bottom & right等等

對於您頁腳（bottom_menus）取你需要設置的所有空間：

#bottom_menus { 
    background-color: orange; 
    height: 15px; 
    position: absolute; 
    left: 0; 
    right: 0; //assuming you need the footer to take the whole width 
    bottom: 0; 
    width: 100%; 
}

PS：小的話，你不需要設置PX當值爲0.

來源

2013-01-18 13:58:16 Mark

絕對CSS位置並不在IE7

回答

相關問題