以未知宽度居中浮动左侧菜单

时间:2012-07-02 19:58:18

标签: css

我想要我的菜单中的Ul的Li元素在中心,我尝试了很多方法,但它不会继续。看看我的CSS:

#menu {
    float: left;
    width: 767px;
    height: 38px;
    margin: 11px 0 0 14px;
    background: url(images/menubg.gif) repeat-x;
    -webkit-border-radius: 0px 0px 7px 7px;
    border-radius: 0px 0px 7px 7px;
    border: 1px solid #efeff1;
}
    #menu ul {
        list-style: none;
        text-align: center;
        padding: 0;
        margin: 0;
        height: 40px;
    }
        #menu ul li {
            float: left;
            color: #767676;
            height: 18px;
            padding: 11px 0px 11px 0px;
            display: inline;
        }
            #menu ul li a {
                font-family: Arial, Helvetica, sans-serif;
                color: inherit;
                font-size: 12px;
                text-decoration: none;
                font-weight: bold;
                display: block;
                padding: 0px 23px 2px 23px;
                border-left: 1px solid #e0e0e2;
            }

我试过显示:内联,文字转换:中心,但它不对。 非常感谢提前。

1 个答案:

答案 0 :(得分:1)

我删除了float并添加了inline-block代替:

http://jsfiddle.net/dtTdg/1/

#menu ul li {
    display: inline-block;