1

我有一个问题,我无法正确地得到我的“li”宽度。我有我正在处理的设计,它们看起来20px与右侧分开,display:inline-block但我似乎无法得到正确的数字。JS小提琴

HTML:

<div class="footer">
            <nav>
                <ul>
                    <li><a href="#">Terms of Use</a></li>
                    <li><a href="#">Site Map</a></li>
                    <li><a href="#">Privacy Policy</a></li>
                    <li><a href="#">Help</a></li>
                    <li><a href="#">Company</a></li>
                    <li><a href="#">Contact</a></li>
                </ul>    
            </nav>

            </div>​

CSS:

.footer nav{
    float:right;
    width:530px;
    padding:13px 0 0 0;
}
.footer nav ul{
    list-style:none;
}
.footer nav li{
    display:inline-block;
    width:80px;
    text-align:center;
}
.footer nav li a{
    text-decoration:none;
    color:#000;
}​
4

1 回答 1

1

如果您希望它们之间的距离固定,则不能将固定宽度的列表项用于具有不同宽度的内容,并且不能将文本居中。只需将宽度保留在auto,并设置 amargin-right20px使它们彼此相距该距离。

于 2012-06-02T02:32:43.227 回答