Question

如何将一个链接置于一个div中，该div在Bootstrap上也有一个内联列表？即使我使用.text-center类，星形链接似乎也不会居中。

<div class="project-status text-center">
    <a class="favourites" href=""><i class="fa fa-star-o"></i></a>

    <ul class="mylist list-unstyled list-inline pull-right">
        <li><a href="">Item</a></li>
        <li><a href="">Item</a></li>
    </ul>
</div>

jsFiddle

Answer 1

您可以尝试此http://jsfiddle.net/ga6p8dcx/2/

.project-status {
    width: 100%;
    padding: 10px;
    margin: 20px 0;
    background: #f5f5f5;
    font-size: 14px;
    font-size: 1.4rem;
    float: left;
    position: relative;
}

.mylist {
    margin: 0;
}

.favourites {
    position: absolute;
    left: 50%;
}

Answer 2

如果您将显示设置为内嵌块和宽度100％，它将居中，但这会导致链接下降到下一行，因为中心文本没有将这些链接考虑在内，所以星形没有居中

Bootstrap：div上的中心链接，带有内联列表

2 个答案: