IE沒有顯示的相對定位的元素

-1

這裏內部絕對定位的元素出浮動元素的是示例代碼複製，而試圖定位他們的父母上述元素我面對該問題：IE沒有顯示的相對定位的元素

<html> 
<body> 
<style> 
    dl { 
     border: 1px solid red; 
     width: 200px; 
     padding-top: 40px; 
     margin: 0; 
     position: relative; 
     overflow: auto; 
    } 
    dt { 
     border: 1px solid blue; 
     margin: 0; 
     padding: 0; 
     width: 98px; float: left; 
     display: block; 
    } 
    dd { 
     border: 1px solid green; 
     margin: 0; 
     padding: 0; 
     height: 38px; 
     position: absolute; 
     top: 0px; 
     left: 0px; 
     width: 198px; 
    } 
</style> 
<dl> 
    <dt>Coffee</dt> 
    <dd>- black hot drink</dd> 
    <dt>Milk</dt> 
    <dd>- white cold drink</dd> 
</dl> 
</body> 
</html>

I」 m試圖構造dl元素並在所有內容上顯示dd，然後通過用戶使用javascript選擇顯示不同的dd -s，這很容易。

當前在ie9中，在怪癖模式下，如果元素並排浮動，則不顯示元素。如果它們沒有浮動，則按預期工作。這是否有一個有意義的解釋或修復，將使dd元素顯示在其他瀏覽器（測試過的chrome，ff，opera，safari）等所有其他元素之上？

這已解決，它與子元素的尺寸和外部元素的尺寸有關，以及它們是否適合父代或內部。這隻發生在怪癖模式下

來源

2011-09-08 Anton S

你*必須*運行怪癖模式您的網站？ – duri

它必須在每種模式下工作，這就是質量標準。正如你所看到的，我已經解決了這個問題 –

你的方法不太對。需要一些修改。

http://jsfiddle.net/7Jjaj/

<ul> 
    <li>Coffee<span>- black hot drink</span></li> 
    <li>Milk<span>- white cold drink</span></li> 
</ul> 

* { margin: 0; padding: 0; } 

ul { 
    overflow: hidden; 
    width: 300px; 
    padding: 40px; 
    list-style: none; 
    border: 1px solid red; } 

ul li { 
    position: relative; 
    float: left; 
    width: 148px; 
    border: 1px solid blue; } 

ul li span { 
    position: absolute; left: -1px; top: -40px; 
    display: block; width: 148px; height: 38px; line-height: 38px; 
    border: 1px solid green; 
}

來源

2011-09-08 07:02:49 Webars

不能改變html結構並且只能解決這個CSS問題，而且我解決了它的怪癖模式，它需要一切都適合內部。但感謝您的回答 –

IE沒有顯示的相對定位的元素

回答

相關問題