CSS佈局僅在IE7中定位文字時纔會發佈圖像

所以這種佈局只會在IE7中造成問題。我正在嘗試使用圍繞視頻嵌入的2幅圖像進行居中佈局，並在其中一幅圖像上顯示一些文字。 IE7將文本方式向右移動。我不確定IE7是否沒有處理居中或其他問題的負邊距方法。CSS佈局僅在IE7中定位文字時纔會發佈圖像

我知道這不是溢出錯誤，因爲我拿出overflow-x: hidden;並得到相同的行爲。如果有人有任何見解或解決方案，我會非常感激，謝謝！

下面是相關代碼：

<div id="hero"> 
    <img src="images/heroleft.jpg" alt="" /> 
    <p id="herotitle">WE ARE A VIDEO PRODUCTION<br />TEAM</p> 
    <iframe src="http://player.vimeo.com/video/22903076?title=0&amp;byline=0&amp;portrait=0&amp;color=ffffff" width="622" height="350" frameBorder='0' border='0' style="border:0"></iframe> 
    <img src="images/herofaderight.jpg" alt="" /> 
</div>

CSS：

body{ 
    margin: 0; 
    padding: 0; 
    color: #fff568; 
    overflow-x: hidden; 
    font-family: "Helvetica Neue", "Helvetica", "Arial", sans-serif; 
} 

#hero{ 
    left: 50%; 
    width: 1160px; 
    margin-left: -580px; 
    height: 350px; 
    position: absolute; 
} 

img,iframe{ 
    float: left; 
} 

p#herotitle{ 
    font-size: 36px;line-height: 38px;font-weight: 600; 
    padding-left: 130px; 
    position: absolute; 
    margin-top: 36px; 
}

來源

2011-05-08 AndrewR

您需要添加left: 0到#herotitle使其在IE7工作。

見IE7：http://jsbin.com/avawo5

另外值得指出的是，你正在做整個頁面的方式可以大大簡化。如果您想了解更多詳情，請告訴我。

來源

2011-05-08 18:00:07 thirtydot

工作，非常感謝你！ – AndrewR 2011-05-08 18:09:10

這並不令我感到驚訝。我喜歡一些輸入，我非常喜歡新手。這個新網站剛剛上線了，以防你說的是舊的。 – AndrewR 2011-05-08 18:32:21

CSS佈局僅在IE7中定位文字時纔會發佈圖像

回答

相關問題