如何調整調整2個並排元素的寬度以適合容器

Question

我在另一個div中有2個div。兩個內部div顯示由我的應用程序生成的文本。文本的長度各不相同。有沒有辦法強制一個內部div，比如說第一個內部div，來填補第二個內部div所剩下的空間？

如果這聽起來有點神祕，採取下面的例子...比分框的寬度寬度取決於所顯示的內容1..0％是短期變化，100％是長...

怎麼辦我確保左邊的按鈕充滿剩餘空間，以便將東西緊緊地放在藍色框中。

Answer 1

我知道的具有可變寬度要做到這一點，最簡單的方法是使用人造表：

<div id="stuff"> 
<div id="name">Jesse James</div> 
<div id="percent">100%</div> 
</div> 


#stuff { display: table; width: 200px; } 
#stuff #name { display: table-cell; width: 100%; background: gray; } 
#stuff #percent { display: table-cell; background: red; } 

http://jsfiddle.net/chovy/HMnSq/