根据内容设置div宽度

Question

我需要将div宽度设置为浏览器默认宽度.这个div包含'ul'和'li'元素.我需要增加div宽度当'li'内容增加时,当浏览器最小化时,这个li元素不应该下降(现在发生)而不是浏览器应该提供horizantal bar.有帮助吗？

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/