所以我的问题是这个 - 我有一个固定大小为970px的div。在其中我想创建一个水平菜单，其中第一个元素将是带有公司徽标的主页链接，其他元素将是指向页面不同部分的标准链接。
我想要的是使徽标的链接比其他链接更宽，让其他链接占用剩余的空间。由于在不久的将来容器div的宽度可能会改变，即使我知道链接的数量我想用百分比来确定它们的宽度，所以一个链接的宽度将是=（div的宽度 - 徽标链接的宽度）/ 5（我将拥有的链接数量。
我试过这样的事情
<div id="main-container">
<div id="logo-container">
</div>
<div id="standard-menu-container">
</div>
</div>
但是我无法使它工作（实际上所有这些都包含在我未在此处展示的另一个div中）。所以谷歌搜索这个我理解，也许使用某种表可以解决我的问题。说实话，我从来没有以这种方式使用过表，但是我按照了一个例子得到了这个结果：JSFiddle Example其中红色矩形是我的Logo链接，问题是其他所有东西都在堆叠下。在这个特定的例子中，徽标链接被排除在<ul>之外，但我也在玩这种情况，只是尝试设置一个像素和其他宽度 - 百分比似乎不是我需要做的。
我会感激任何帮助，只是想到我尝试了很多div和display: inline-block的样式，它打破了我的结构的其他部分所以我更喜欢一个解决方案，其中正常的流量不受干扰（比如使用表格）
答案 0 :(得分：1)
你在display: table-cell的右侧。我已经做了一些更改，你有额外的代码不需要，并将<ul>设置为display: table，而不是容器。添加table-layout: fixed将使列表中的项（单元格）占据相同的宽度。
然后，将徽标向左浮动，不要为＃main-menu-navigation指定宽度，因为它会填充剩余空间，并为margin-left: 150px提供符合徽标宽度的内容。
所以阅读时没有多大意义。看看这里：
<强> http://jsfiddle.net/LREbC/1/
尝试调整大小，单元格将适应宽度。
注意：使用table-cell时，您不需要定义宽度，行为与实际表格单元格相同。