Bootstrap使保证金达到ul

时间:2018-01-12 14:45:15

标签: css bootstrap-4 margin padding

我想知道为什么Bootstrap会增加"保证金"到我的ul。

没有:Default

使用:Bootstrap as Import

<!-- HEADER -->
<div class="header">
    <div class="container">

        <ul class="list-group">
            <li class=""><a href="#start">CompanyX.com</a></li>

            <li class="right"><a href="#logout"><i class="fa fa-sign-out"></i></a></li>
            <li class="right"><a href="#money">Hey: Peter G.</a></li>
        </ul>
    </div>
</div>

CSS:https://hastebin.com/uqawiwuyer.css

希望有人能帮助我。

1 个答案:

答案 0 :(得分:3)

它实际上不是Bootstrap的东西,而是默认的浏览器特定样式。每个浏览器都会为特定元素添加默认样式,至少Chrome,Firefox和Sarafi都会向所有<ul>元素添加40px的填充左侧。

不确定它背后的推理但是预感是浏览器试图在列表中添加一些可视空间。

CSS normalizer将解析部分默认样式。 Bootstrap已经包含一个,但它不会删除ul间距,所以只需在bootstrap.css文件底部的底部添加以下代码即可。

ul {
  margin: 0; 
  padding:0
}