开发者

CSS menu with width 100%

开发者 https://www.devze.com 2023-03-10 02:02 出处:网络
I\'m trying to make a navigation bar with ul/li but I want it to take all the availa开发者_JAVA技巧ble width and distribute the size between the li\'s inside it.

I'm trying to make a navigation bar with ul/li but I want it to take all the availa开发者_JAVA技巧ble width and distribute the size between the li's inside it.

Is it possible?

thanks!


You can use the table styles. Note that these are not supported in < IE8.

HTML

<ul>
    <li>home</li>
    <li>about</li>
    <li>contact</li>
</ul>

CSS

ul {
   display: table; 
   width: 100%;
}

ul li {
   display: table-cell; 
}

jsFiddle.

The borders in the jsFiddle there are for visual aid only. They are not necessary.

0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号