CSS Twitter Bootstrap 删除跨度的边距
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10531545/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Twitter Bootstrap Remove Margin of the Span
提问by Harsha M V
I am using Twitter Bootstrap. And i have used span8 and span 4 in a row. Is there anyway to remove the leading margin-left:20px from the first span of the row without needing to over ride it manually ?
我正在使用 Twitter Bootstrap。我已经连续使用了 span8 和 span 4。无论如何要从行的第一个跨度中删除前导 margin-left:20px 而无需手动覆盖它？
回答by Andres Ilich
That 20px margin you see on your #mainContentarea is due to the setup of the bootstrap grid, which uses a container of 940px, it is supposed to be removed by the .rowcontainer with a margin-left:-20pxproperty. In your setup, your content area is working just the way it was designed too, but your top pageHeaderand mainNavsections are not appropriately inserted into the grid, you just have divs inside the .rowtop sections that are not being contained within the proper containers of the grid.
你在你的#mainContent区域看到的 20px 边距是由于引导网格的设置，它使用 的容器940px，它应该被.row具有margin-left:-20px属性的容器删除。在您的设置中，您的内容区域也按照设计的方式工作，但是您的顶部pageHeader和mainNav部分没有正确插入到网格中，您只有.row顶部部分中的div没有包含在网格的正确容器中.
To fix this you can just insert all of your pageHeaderand mainNavelements inside a .span12container and everything should stack accordingly.
要解决此问题，您只需将所有pageHeader和mainNav元素插入.span12容器中，所有内容都应相应地堆叠。
Fixed markup
固定标记
<header class="row" id="pageHeader">
<div class="span12">
<div id="logo">Logo</div>
<div id="userDetails">userDetails</div>
</div>
</header>
<nav id="mainNav" class="row">
<div class="span12">
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="dashboard.html">Dashboard</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="idea_exchange.html">Idea Exchange</a></li>
</ul>
</div>
</nav>
Also, quick tip, you can switch your mainNavbackground color to the proper grid container of .span12simply by targeting it like so:
另外，快速提示，您可以简单地将mainNav背景颜色切换到适当的网格容器，.span12如下所示：
nav#mainNav .span12 {
background: url("../images/nav_bar_bg.png") repeat-x scroll 0 0 transparent;
height: 45px;
overflow: hidden;
}
回答by Luis
you can add a class in your css with an !important:
您可以使用 !important 在 css 中添加一个类：
example:
例子：
.no_margin{
margin:0px !important;
}
and add that class to your html when required.
并在需要时将该类添加到您的 html 中。
(sorry for my bad english xD)
（对不起，我的英语不好xD）
回答by Nati Krisi
there is also small less utility at
也有少量的效用
http://getkickstrap.com/extras/#single-view
http://getkickstrap.com/extras/#single-view
called flushspan
称为冲洗跨度
回答by Fury
By using "row" or "row-fluid" class as parent of your span class
通过使用“row”或“row-fluid”类作为span类的父类
<div class="row">
<div class="span3">
<ul>
<li><a href="home.html">Home</a></li>
<li><a href="dashboard.html">Dashboard</a></li>
<li><a href="blog.html">Blog</a></li>
<li><a href="idea_exchange.html">Idea Exchange</a></li>
</ul>
</div>
</div>
