使div（在CSS中）自下而上增長？怎麼樣？

我想知道如何讓div自下而上，而不是像通常那樣。使div（在CSS中）自下而上增長？怎麼樣？

我在這裏的例子是jsFiddle。正如你可以看到正確的div會隨着更多的內容而增長，但我希望這兩個div保持固定在同一水平。（左邊的div永遠不會增長）

我該如何讓右邊的div增長爲自下而上？

<div id="wrapper"> 
    <div id="div_1"> 
     læskdfsædlfksæ 
    </div> 

    <div id="div_2"> 
      <tr> 
       <td>AUTHENTIQUE</td> 
       <td class="field_2">1.6 16V</td> 
       <td class="field_3">239 </td> 
      </tr> 

      <tr> 
       <td>AUTHENTIQUE</td> 
       <td class="field_2">1.6 16V</td> 
       <td class="field_3">239 </td> 
      </tr> 
    </div> 
    <div class="clearing"></div> 
    <div id="base"></div> 
</div>

的CSS：

#wrapper{ overflow: hidden;} 

#div_1{ 
    border: 1px solid red; 
    width: 100px; 
    height: 50px; 
    float: left; 
} 

#div_2{ 
    border: 1px solid black; 
    width: 200px; 
    float: left; 
} 

.clearing{ clear: both;} 

#base{ border-top: 2px solid #666;}

來源

2012-03-14 YoniGeek

如果u添加更多的內容表，股利是擴大... gont得到你的意思。 – Ace 2012-03-14 14:02:08

你的HTML是一團糟。不要把div和tr/td這樣混在一起 – HerrSerker 2012-03-14 14:08:09

@yunzen我知道我只是想出了一些快速骯髒的內容來展示這個想法 – YoniGeek 2012-03-14 14:31:22

沒有運氣浮動：左，因爲他們始終是對齊的頂部。更改爲顯示：inline-block;

http://jsfiddle.net/HerrSerker/ZEYvk/15/

注：</div>和<div ...>

來源

2012-03-14 14:11:20 HerrSerker

好男人謝謝 – YoniGeek 2012-03-14 14:32:07

改變浮到內聯之間沒有空格可能是你所追求的 - 但你也可以完全屬於你的div相對位置到另一個DIV它的內部並使用bottom: 0來保持div卡住。

來源

2012-03-14 14:16:50 nick501414

這可以用JavaScript來定。我用jQuery的作爲示例所示：jsfiddle

我剛添加的代碼：

$(document).ready(function(){ 
    $("#div_1").height($("#wrapper").height()); 
});

來源

2012-03-14 14:18:34

我覺得這段代碼不會做這件事...... :( – YoniGeek 2012-03-14 14:32:42

Make確保包含jQuery庫..它可以在所有瀏覽器上正常工作。 – 2012-03-14 15:37:57

使div（在CSS中）自下而上增長？怎麼樣？

回答

相關問題