提问者:小点点

使用Bootstrap[重复]对列居中


我有以下代码:

    <div class="row">
        <div class="col-xs-12" id="buttonList">
            <ul class="list-inline">
                <li><button id="homeBtn" type="button" class="smallMarginB headerButton active btn btn-sm btn-primary">Home</button></li>
                <li><button id="aboutBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">About</button></li>
                <li><button id="servicesBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">Services</button></li>
                <li><button id="transBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">Transformations</button></li>
                <li><button id="testBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">Testimonials</button></li>
                <li><button id="contactBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">Contact</button></li>
                <li><button id="faqBtn" type="button" class="smallMarginB headerButton btn btn-sm btn-primary">FAQ</button></li>
            </ul>
        </div>
    </div>

它只是在单个列中显示按钮。无论用户的分辨率如何,我都希望它是居中的。我试过使用offesets,但对于奇怪的分辨率它不起作用(例如分辨率是1366px)。我也尝试添加col-centered和margin:auto但没有成功。


共2个答案

匿名用户

尝试将class=“text-center”添加到div col元素:

<div class="col-xs-12 text-center" id="buttonList">

匿名用户

您可以尝试:

边距-左:自动;边距右:水平对齐的auto

边距-顶部:自动;margin-bottom:auto,用于垂直对齐

边距:auto