Question

我正在使用如下所示的bootstrap网格，我正在尝试集中一些div。（pic）。我已经尝试过所有{margin：0 auto;宽度：50％}等等，但我不能解决它。将一些div集中起来并不困难。这有什么问题？请不要将其标记为重复。我一整天都在研究，我无法解决这个问题。谢谢

<header data-spy="affix" id="myHeader" class="container row">
            <div class="col-sm-4 ">
                <div class="centralize">
                        <a href="http://www.facebook.com" target="_blank">
                        <img class="logos" src="images/facebook.png" onmouseover="zoomin(this.id)" onmouseout="zoomout(this.id)">
                        </a>    

                        <a href="http://www.twitter.com" target="_blank">
                        <img class="logos" src="images/twitter.png" onmouseover="zoomin(this.id)" onmouseout="zoomout(this.id)">
                        </a>    

                        <a href="http://www.instagram.com" target="_blank">
                        <img class="logos" src="images/instagram.png" onmouseover="zoomin(this.id)" onmouseout="zoomout(this.id)">
                        </a>

                </div>
            </div>  
            <div class="col-sm-4">
                <div class="centralize">
                        //Other Stuff to be centralized 
                </div>
            </div>                  
            <div class="col-sm-4">
                <div class="centralize">
                        //Other Stuff to be centralized 
                </div>
            </div>          
    </header>

Answer 1

实际上{margin：0 auto;宽度：50％}它应该可以工作。

但是在你的代码中我看到你在父div上使用.col-sm-4类只占宽度的1/3。它可能适用于.col-sm-12而不是100％

Answer 2

要使class="centralize" div中的内容居中对齐，请使用：

.centralize {
    text-align: center;
}

在Bootstrap响应网格中居中心

2 个答案: