如何使用bootstrap将动态div集中在一起

Question

我有一个LOOP，可以放置包含图像的div。 想法是在每行放置3个图像， 我不知道用户将插入多少图像。 但我知道图像/ div需要在引导网格中居中（！）。 那样：

_ _

我尝试使用列表但没有成功。 感谢...

Answer 1

据我所知，使用默认的Bootstrap无法做到这一点但不用担心，你只需要添加：

<div class="container">
    <div class="row row-centered">
        <div class="col-xs-6 col-centered"></div>
        <div class="col-xs-6 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
        <div class="col-xs-3 col-centered"></div>
    </div>
</div>


/* centered columns styles */
.row-centered {
    text-align:center;
}
.col-centered {
    display:inline-block;
    float:none;
    /* reset the text-align */
    text-align:left;
    /* inline-block space fix */
    margin-right:-4px;
}

查看更多here

Answer 2

你可以玩＆＃34; col-md-X＆＃34;和＃34; col-md-offset＆＃34;，第一个告诉你div的空间，第二个告诉你左边的空格。