DIV不是全寬

Question

我有兩個div的這樣

<div id="left"><p>.....</p><br/> 
<p>.....</p> 
</div> 
<div id="right"><img ..../></div> 

而且我有CSS。

#left 
{ 
position: relative 
float: left; 
} 


#right 
{ 
position: relative 
float: right; 
} 

權股利不浮動，以正確的，因爲在左p元素沒有給出正確的div元素的空間，但在CSS我不設置P公司這樣的寬度：100％。如何使左寬度變得靈活？我不知道圖像寬度，所以我不能在兩個div上設置固定寬度。

Answer 1

非浮動塊單元將用作浮動元素的「天花板」，它們出現在它們下面。基本上，嘗試這樣的事情：

<div> 
    <div id="right"><img .../></div> 
    <p>......</p> 
    <p>......</P> 
</div> 

Answer 2

p是一個塊元素，所以它的100％寬度有點默認。你可以將它的寬度設置爲另一個值，或者只是浮動圖像而不浮動（所以浮動應該如何工作）。

Answer 3

你必須設置寬度#left否則這將無法解決問題。作爲解決方法，我建議將#right div標記放在左側，並將其右移。在你的簡單例子中，它運行良好。

其他選項將使用Javascript。您可以在加載圖像時獲得圖像的寬度，然後按照一定的寬度設置寬度，但這有點難看。

Answer 4

這個問題似乎是一個很好的在Doctype問過。