Question

我想将我的浮动菜单（ul标签）放在我的页面中，并且无法弄清楚我的CSS有什么问题。请帮忙。感谢。

我的HTML

<section>
    <div id='index'><img src='images/index_pic.png' title='index Picture'/></div>
    <nav>
        <ul>   ////I want to center this menu, but the 3 buttons all float to left.
            <li id=browser ><a href=#></a></li>
            <li id=user_management><a href=#></a></li>
            <li id=log_out><a href=#> </a></li>
        </ul>

    </nav>
</section>

和我的css

section {
    color: blue;
        margin: 0 auto;
    color:blue;
    width:980px;
    height:700px;
}
ul{

    list-style:none;
}

#browser a{
    color:red;
    width:270px;
    height:32px;
    display:inline-block;
    float:left;
    background-image:url('../images/browser_BT.jpg');
}
#user_management a{
    color:red;
    width:270px;
    height:32px;
    display:inline-block;
    float:left;
    background-image:url("../images/user_management_BT.jpg");
}
#log_out a{
    color:red;
    width:270px;
    height:32px;
    display:inline-block;
    float:left;
    background-image:url('../images/log_out_BT.jpg');
}


section #index img{
padding:3px;
border:1px solid #a6a6a6;
}

Answer 1

试试这个：

ul {
    list-style: none;
    width: 810px;
    margin: 0 auto;
}

如何集中我的浮动导航菜单？

1 个答案: