CSS中子菜单的自定义宽度答案

【问题标题】：Custom width for submenus in CSSCSS中子菜单的自定义宽度
【发布时间】：2014-12-17 22:16:10
【问题描述】：

我只能在"<ul>" 中为"<li>" 设置一个均匀的宽度。如何根据内容按比例分配？我只能设置以 px 或百分比表示的固定大小的宽度。

谢谢

【问题讨论】：

你能发布你的代码的 jsFiddle 吗？
jsfiddle.net/xdfu82ao
试试ul { overflow: hidden; } li { width: auto; float: left; }
如果我将宽度设置为自动，则文本之间根本没有空格。
找到了，现在听起来很简单，但我并没有想到。我将宽度设置为自动并写入“margin-left:20px”和“margin-right:20px”。感谢大家的帮助。

标签： css width

【解决方案1】：

你可以使用display:table / table-cell

JSfiddle Demo

CSS

ul {
    margin: 0;
    padding: 0;

    list-style: none;
    display: table;
    width:100%;
    text-align: center;
}

li {
    display: table-cell;
    border:1px solid grey;    
}

【讨论】：