Css 如何调整2个并排元素的宽度以适合容器

我在另一个div中有两个div。两个内部div显示由我的应用程序生成的文本。文本的长度各不相同。有没有办法强迫一个内部div，比方说第一个，填充第二个内部div留下的空间

如果这听起来很神秘，就拿下面的例子来说吧。。。分数框的宽度因显示内容的不同而不同。。0%短，100%长

我如何确保左边的按钮填满剩余空间，使东西紧紧地放在蓝色的盒子里

---

我所知道的使用可变宽度的最简单方法是使用人造表格：

<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; }

杰西·詹姆斯
100%
#stuff{显示：表格；宽度：200px；}
#填充#名称{显示：表格单元格；宽度：100%；背景：灰色；}
#填充#百分比{显示：表格单元格；背景：红色；}