在正常流量重疊的部門

我試圖將一系列div（它們是高度動態的）一個接一個地定位，以便它們的寬度與其父母相同。我的理解是，這是正常流程應該做的事情，但它們最終會重疊。在正常流量重疊的部門

見http://www.euro-endo.nl/technologies.php

我的HTML：

<div id="col"> 

<div id="thing"> 
    <div id="rimage"> 
    <div id="pic1"></div> 
</div> 
<div id="ltext"> 
    text1 
</div> 
</div> 
<div id="thing"> 
    <div id="limage"> 
    <div id="pic2"></div> 
</div> 
<div id="rtext"> 
    text2 
</div> 

</div>

和相應的CSS是：

#col { 
    position: absolute; left: 20px; right: 50px; top:0; bottom:0px; 
    width: auto; 
    padding: 10px 20px 0px 0px; 
    overflow: hidden; 
} 
#thing { 
    position: static; 
    width: 100%; 
    height: auto; 
    Margin: 20px; 
} 


#ltext { 
    position: absolute; left: 0px; right: 210px; top:0px; bottom:0px; 
    width: auto; 
    height: auto; 
} 

#rtext { 
    position: absolute; right: 0px; left: 210px; top:0px; bottom:0px; 
    width: auto; 
    height: auto; 
} 

#rimage { 
    position: absolute; right: 0px; top:0px; bottom:0px; 
    width: 210; 
    height: auto; 
} 


#limage { 
    position: absolute; left: 0px; top:0px; bottom:0px; 
    width: 210; 
    height: auto; 
}

（有一對夫婦更多的id="thing"div的，但我認爲這給它的要點。）

來源

2011-09-30 Ixxie

確實存在一個大問題...

您不能有多個<div>共享相同的id。

id對於每個<div>必須是唯一的。

如註釋中所述，您可以使用類將樣式一次應用於多個元素。

您也將它們全部設置爲position:absolute;與top:0px;，它們將它們全部放在同一位置。

通過W3C驗證運行你的頁面會趕上許多問題，如多id的...

http://validator.w3.org

來源

2011-09-30 16:45:02 Sparky

+1。 Id應該是唯一的。考慮使用類來代替。 –

你的div是不是在正常流動時，他們絕對定位。這就是元素重疊的原因。絕對定位將把它們'絕對地'放在最接近定位的父親的位置。

請注意有關唯一ID名稱的其他註釋。

來源

2011-09-30 18:24:32 Rob

在正常流量重疊的部門

回答

相關問題