自动适合li到文本的宽度？

Question

有没有可能使用CSS自动将<li>标签的宽度调整到它包含的文本的宽度？

我正在设计一个使用自定义CMS的网站(我无法访问代码),因此就设计而言,我的选项有限.

无需直接编辑任何列表属性即可在<li>标签上运行的Javascript解决方案也可以正常工作.

Answer 1

这<li>是一个块级元素,因此默认为尽可能宽.

要使其"收缩"到内容的大小,请尝试浮动它:

li {
    float:left;
    clear:left;
}

这可能会做你想要的.

如果你想让<li>s坐在一起,你可以尝试:

ul {
    clear: left;  /* I like to put the clear on the <ul> */
}
li {
    float: left;
}

要么

li {
    display: inline
}

使它inline消除其块级状态,因此它就像一个<span>或任何其他内联元素.

Answer 2

正如@willoller已经说过的那样,li元素是一个块级元素,但除了浮动它之外,你还可以使用:

li {
    display: inline;
}