代码之家  ›  专栏  ›  技术社区  ›  user7259161

引导响应网格上的中心DIV

  •  1
  • user7259161  · 技术社区  · 9 年前

    我正在使用如下所示的引导网格,并试图集中一些div。( pic ). 我已经尝试了所有的方法{margin:0 auto;width: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>
    
    2 回复  |  直到 9 年前
        1
  •  0
  •   Johann Kratzik    9 年前

    实际上,使用{margin:0 auto;width:50%}应该可以。

    但是在您的代码中,我看到您在父div上使用了.col-sm-4类,它只占宽度的1/3。它可能与col-sm-12配合使用,但需要100%

        2
  •  0
  •   Ryan Gee    9 年前

    要将内容居中对齐,请在 class="centralize" 对于DIV,请使用:

    .centralize {
        text-align: center;
    }