因为我将引导程序从2.1升级到3.0,所以我无法集中很多div
例如,使用此代码:
<div id="center" class="container"> <div class="row"> <div class="btn-toolbar"> <div class="btn-group"> <a class="btn btn-default" href="#">test</a> </div> </div> <br /> <p>Am I centered ?</p> <a class="btn btn-default" href="#">Back</a> </div> </div>
我有这个规则:
#center { margin: 0 auto; }
但结果是:
或者另一个例子,如何居中:
<div id="center" class="container"> <div class="row"> <li class="col-md-5"> <ul class="list-unstyled"> <li><i class="icon-user"></i> aaaaaaaaa</li> <li><i class="icon-envelope"></i> bbbbbbbbbb</li> <li><i class="icon-envelopebug"></i> cccccccccccc</li> </ul> </li> <li class="col-md-5"> <ul class="list-unstyled"> <li><i class="icon-user"></i> aaaaaaaaa</li> <li><i class="icon-envelope"></i> bbbbbbbbbb</li> <li><i class="icon-envelopebug"></i> cccccccccccc</li> </ul> </li> </div> </div>
谢谢您的帮助
解决方法
为了使用margin来居中块级元素:0 auto;它的宽度必须小于其包含的块(因为auto值是有意义的) – 因为#container跨越其父级的宽度(< body>),所以根本没有要分配的边距.
保证金的一种方法:0自动;将.btn-toolbar设置为内联块,然后通过添加text-align:center来居中;到它的包含块.您可以将相同的概念应用于第二个示例:
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。