html – 在Bootstrap的行中居中动态数量的col div

概述我想在bootstrap中连续居中动态数量的col项.我试图用Bootstrap找到一种方法,但似乎完全没有了. 使用bootstrap的人会知道 – cols移动到最左边.您可以将动态数量的col项放入一行 – 它不需要添加到12(因此请不要建议它).如果您要动态地列出项目列表,这一点很重要.您可以根据需要连续添加任意数量的cols. 我想做的就是确保 – 无论行中有多少物品 – 它们都位于窗口 我想在bootstrap中连续居中动态数量的col项.我试图用bootstrap找到一种方法,但似乎完全没有了.

使用bootstrap的人会知道 – cols移动到最左边.您可以将动态数量的col项放入一行 – 它不需要添加到12(因此请不要建议它).如果您要动态地列出项目列表,这一点很重要.您可以根据需要连续添加任意数量的cols.

我想做的就是确保 – 无论行中有多少物品 – 它们都位于窗口的中央.它们都是这样的：class =“col-lg-2 col-md-3 col-sm-4 col-xs-6”.例：

<div >    <div >        <div >            <div >                <div >                    Something here 1                </div>            </div>        </div>        <div >            <div >                <div >                    Something here 2                </div>            </div>        </div>        <div >            <div >                <div >                    Something here 3                </div>            </div>        </div>    </div></div>

可能有1,2,3或多少.我不知道,因为服务器排列的列表中有很多项目.无论哪种方式,我都需要整行,无论其中有多少个面板,都要居中.

我知道我可以在视图中使用服务器端代码对div进行编程,但这会非常复杂.在bootstrap中必须有一些方法来实现这一点！我还没找到它.我已经阅读了大量的SO答案,但没有一个与我想做的事情有关.我不知道为什么它不会让你只是把行放在中心 – 非常令人沮丧.

我只是想把行cols居中.

解决方法 你可以在行上使用居中的类,并使用下面的CSS工作小提琴附加.

.centered {   text-align: center;   Font-size: 0;}.centered > div {   float: none;   display: inline-block;   text-align: left;   Font-size: 13px;}

http://jsfiddle.net/ug4fzcjd/64/

总结

以上是内存溢出为你收集整理的html – 在Bootstrap的行中居中动态数量的col div全部内容，希望文章能够帮你解决html – 在Bootstrap的行中居中动态数量的col div所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。