幫助，IE7搶了我的divs，現在他們跑掉了屏幕！

Question

我的網站，http://hivechatter.com/，是火狐，Chrome，IE8超性感，你的名字：

但隨後走來IE7，誰mauls她的div如此糟糕，以至於他們幾乎跑出畫面！無論出於何種原因，div內的內容都是以中心爲中心的。這裏發生了什麼？這似乎與IE7解釋左邊的方式有關：百分比邊際，但我無法弄清楚。

爲了方便和子孫後代的緣故，下面是刪除我的CSS的有關部分，以文本格式和其他廢話。 #container是整個頁面容器，#blue_box是主要內容框，#l​​eft和#right是藍色框中的列，#divider是將它們分開的白線，#links是在#blue_box下方懸停的淺藍色導航欄。

#background { 
    width: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    z-index: -9999; 
} 

html, body { 
    margin: 0; 
    padding: 0; 
    height: 100%; 
} 

body { 
    background: no-repeat #222933; 
    overflow: hidden; 
}  

#container { 
    position: relative; 
    left: 34%; 
    top: 10%; 
    width: 50%; 
    min-width: 450px; 
    max-width: 700px; 
    overflow: auto; 
    padding: 0; 
} 

#blue_box { 
    position: relative; /* so that divider has appropriate height */ 
    width: 94%; 
    padding: 3%; 
    overflow: auto; /*needed so that div stretches with child divs*/ 
} 

#left { 
    position: relative; 
    float: left; 
    width: 44%; 
    margin: 0; 
    padding: 0; 
} 

#right { 
    position: relative; 
    float: right; 
    width: 49%; 
    margin: 0; 
    padding: 0; 
}  

#divider{ 
    position:absolute; 
    left:49%; 
    top:6%; 
    bottom:6%; 
    border-left:1px solid white; 
} 

#links { 
    float: right; 
    width: 16em; 
    overflow: auto; 
} 

Answer 1

將您的位置從相對於絕對變爲容器CSS。

你的問題是你的圖像只是在那裏與相對定位後的容器。

Answer 2

目前無法測試此問題是否可以解決問題，但在藍框中使用邊距來定位而不是位置：相對通常使古代Internet Explore的黑暗世界中的事情變得更容易。

Answer 3

IE7將您的容器居中，因爲您已將自己的身體設置爲text-align:center，那麼您將設置容器left:34%。 IE只是因爲某些原因將這些加在一起。這可能是爲什麼你的東西在IE中居中。你可以爲IE7做一個條件樣式表，並刪除文本對齊。