css - 根据内容设置div宽度

Question

我需要将 div 宽度设置为浏览器默认宽度。此 div 包含“ul”和“li”元素。我需要增加 div 宽度当“li”内容增加时，以及当浏览器最小化时，这个 li 元素不应该下降(现在正在发生)，而浏览器应该提供水平栏。有帮助吗？

div结构为

<div style="position:relative;border:1px solid red; line-height:16px;width:100%">
    <ul style="position:relative;background:green;height:30px; width:100%;list-style:none; margin:0;">
        <li style="position:relative; display:inline-block; padding-left:20px; float:left; background:red" >Welcome</li>
        <li style="position:relative; display:inline-block; padding-left:20px; float:left; background:red" >Welcome</li>
        <li style="position:relative; display:inline-block; padding-left:20px; float:left; background:red" >Welcome</li>
        <li style="position:relative; display:inline-block; padding-left:20px; float:left; background:red" >Welcome</li>

    </ul>

</div>

Answer 1

你好，像这样使用显示属性

ul li{
display:inline-block;
}

现场演示 http://jsfiddle.net/cL9FB/