css - CSS：对齐浮动的 li 在 div 内居中？

Question

HTML

<div class="wrapper join-links">
    <ul>
       <li><a href="link">Whatever</a></li>
       <li><a href="link">Something</a></li>
    </ul>
</div>

CSS

.join-links li {
    float:left;
    margin-right:20px;
}

是否有可能在环绕的包装器 div 内将两个链接“居中”或“对齐”对齐？

编辑：我也想知道我是否可以将它们对齐？

score 4 · Accepted Answer

改成float: left给display: inline你：

.join-links li {
    display: inline;
    margin-right:20px;
}

然后，您可以在父 div 上使用 text-align。

score 1 · Accepted Answer

要将链接向右或居中对齐，您需要使用文本对齐并显示内联或内联块到 li 元素。Float 属性将任何元素转换为块。 http://jsfiddle.net/CRrmL/15/ http://jsfiddle.net/CRrmL/16/

score 1 · Accepted Answer

您可以通过用于居中的常见边距黑客来做到这一点：

.join-links ul{
    margin:0 auto;
}

然后你需要设置li要在行中显示的元素：

.join-links li {
    display:inline;
}

score 1 · Accepted Answer

您可以像这样使链接合理。只需为两者定义一个类，然后从第一个到左，第二个到右li浮动。lili

4 回答 4