並排對齊兩個div

Question

我有這塊html代碼。我喜歡wuiLeftArea和wuiMainArea在任何時候都保持並排。現在，當縮小窗口時，WuiMainArea div將低於無風區域。有沒有辦法迫使wiMainArea div始終保持正確？

<div id="wuiLeftArea"> 
     <div id="wuiLefthandNavRoot"> 
      <div id="tree"> 
      </div> 
    </div> 
</div> 

<DIV id=wuiMainArea sizcache="5" sizset="1"> 
    <DIV id=wuiMainContent sizcache="5" sizset="1"> 
     <DIV id=wuiInpageNav sizcache="5" sizset="1"> 
       <DIV id=chart class=wui-inpage-container style="float:right; width: 1200px;min-height:500px;display: block; overflow: hidden;"> 
       <p > this is the area to put charts. this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
         this is the area to put charts. 
       </p> 
      </DIV> 
     </DIV> 
    </DIV> 
</DIV> 

Answer 1

這將始終發生，除非在容器上有固定的大小或溢出被明確設置;否則，無論何時調整容器大小，它都會重新安排其子項以適應寬度方向進入其體內。

Answer 2

http://jsfiddle.net/XCEjf/

.wui-inpage-container { 
    width: 50%; 
} 

通過使用相對寬度你讓浮子總是在頁面寬度的房間，防止纏繞。

Answer 3

使用基於百分比的長度。如果左側的容器構成頁面寬度的25％，主容器構成75％的寬度，那麼無論瀏覽器變得多小，都會有1/4 3/4分割