css postioning issue

Question

我想要做的是，將兩個div放在一行中，左側div的寬度是固定的，正確的，在瀏覽器調整大小（已經實現）時調整大小。我想實現的是，爲右分區設置一個調整大小限制，也就是說，右分區寬度減小，直到寬度大於或等於n px。之後瀏覽器水平滾動。

（原因是我有一個jquery選項卡在右邊的div與5個選項卡，當我調整瀏覽器的標籤在彼此的按鈕上跳轉，因此我想停止右div縮小直到最後一個標籤）。

這裏是我到目前爲止的代碼：

<div style="float: left; width: 300px; margin-right: 10px; "> 

</div> 

<div style="overflow: hidden;"> 

</div> 

請讓我知道是否有將兩個格在一行中的一個更好的方法（左寬度固定，右可調整大小與限制）。

乾杯，

Answer 1

你要麼在看最小寬度/最大寬度，或者@media

對於最小寬度只給一個類或ID來DIV2和最小寬度

設置

#div2{ 
     min-width:900px; 
    } 

對於不同屏幕尺寸的控制，使用@media並設置最大/最小寬度。

@media only screen and (max-width: 499px) { 
     /* rules that only apply for canvases narrower than 500px */ 
    } 

    @media only screen and (min-width: 500px) { 
     /* rules that only apply for canvases wider than 500px */ 
    } 

還有更多的信息在這裏：http://mislav.uniqpath.com/2010/04/targeted-css/

Answer 2

嘗試：

<div class='left'></div> 

<div class='right'></div> 

<styles> 
.left { 
    float: left; 
    margin-right: 10px; 
    width: 300px; 
} 
.right { 
    float: left; 
    max-width: 300px; 
    overflow-x: auto; 
} 
</styles>