css导航固定页面宽度

Question

我有一个导航列表

<div id='nav'>
        <ul>
            <li><a href='index.php' id="home">Home</a></li>
            <li><a href='products.php' id="products">Products</a></li>
            <li><a href='sign up.php' id="signup">Sign up</a></li>
            <li><a href='cart.php' id="cart">Cart</a></li>
        </ul>
    </div>

我已经通过 CSS 制作了“a”元素的样式，高 25 像素，宽 100 像素，并赋予了背景颜色，

#nav li a {
height: 25px;
width: 100px;
display: block;
text-align: center;
background-color:#FFE9BA;
}

但我仍然希望整个导航跨越页面的宽度，我该怎么做？谢谢!

Answer 1

类似于 this ？

添加了以下 CSS

#nav {
text-align: center;
background-color:#FFF9CA;
}


#nav li {
display: inline-block;
}