css - 如何创建具有自动调整大小的列的多行部分

Question

仍在学习 CSS，如果这很明显请原谅 -

我正在构建一个包含四个部分的标题:

|Header-------------------------------|  
|----Title----|----NavigationLinks----|  
|----Taglines-|----SelectionBar-------|
|-------------------------------------| 

我想要的是标语部分自动设置第一列的宽度(它的内容比标题长)，然后第二列延伸到标题部分的末尾。我不知道如何在不设置特定宽度的情况下使列相互匹配 - 是否可以在没有固定宽度区域的情况下做到这一点？

我已经能够使用 display: table-cell; 接近我需要的东西；但不知道如何将第二行“连接”到第一行。

更新:缺少标记会导致 div 忽略显示:表格* 设置。使用 display: table/table-row/table-cell 创建表格布局可以满足我的需要:table-cell 将自动拉伸(stretch)影响其上方行宽的列。

Answer 1

不确定这是否是您要找的东西。问题似乎有点不清楚。

http://jsfiddle.net/KacPY/1/