twitter-bootstrap 自举标签之间没有间距
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/24380129/
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
No spacing between bootstrap labels
提问by blueFast
In my application, I am trying to have several conecutive labels, like in this jsbin:
在我的应用程序中,我试图有几个连续的标签,就像在这个jsbin 中一样:


Instead, I am getting this:
相反,我得到了这个:


As you can see, no spacing is present between the labels. This is probably because of a problem in my CSS, but I am unable to find the culprit.
如您所见,标签之间没有间距。这可能是因为我的 CSS 存在问题,但我无法找到罪魁祸首。
Where is the spacing between labels defined in bootstrap? Knowing that would allow me to narrow the bug-search in my CSS.
bootstrap 中定义的标签之间的间距在哪里?知道这将允许我缩小 CSS 中的错误搜索范围。
采纳答案by Anderson Freitas
This has nothing to do with your CSS at all. Just add a space or break the line between your ".label" tags.
这与您的 CSS 完全无关。只需在“.label”标签之间添加一个空格或换行即可。
This happened to me when the framework I use started to compress the HTML in order to save some bytes.
当我使用的框架开始压缩 HTML 以节省一些字节时,这发生在我身上。
You can see this effect on this jsbin.
你可以在这个jsbin上看到这种效果。
回答by George Filippakos
You need to removethe space from insidethe label.
您需要从标签内部删除空间。
The following spans have no space between each other:
以下 span 之间没有空格:
<span class="label label-primary"> Primary </span>
<span class="label label-default"> Default </span>
The following spans have the correct spacing between them:
以下跨度之间具有正确的间距:
<span class="label label-primary">Primary</span>
<span class="label label-default">Default</span>
Notice that the leading/trailing white space must be removed from insidethe span element for them to work correctly.
请注意,必须从span 元素内部删除前导/尾随空格,它们才能正常工作。
回答by macm
I did this.
我这样做了。
.label {
margin-left: 5px;
}
You can edit your bootstrap.css or edit less/labels.less and compile.
您可以编辑 bootstrap.css 或编辑 less/labels.less 并编译。
The space problem could be something in javascript code. I am testing without javascript from bootstrap.
空间问题可能出在 javascript 代码中。我正在测试没有来自引导程序的 javascript。
回答by AyB
The spacing between the labels (using <span>) is not defined in bootstrap, in fact, it's the default HTML CSS in-built into the browser.
标签之间的间距(使用<span>)在引导程序中没有定义,事实上,它是浏览器内置的默认 HTML CSS。
I'm not sure what CSS could cause spacing like that between the <span>elements (leaving out padding and margin) but I stronglysuspect the reason it's not applying in your case is because you have a float:left;somewhere added to your span elements.
我不确定是什么 CSS 会导致<span>元素之间出现这样的间距(不包括填充和边距),但我强烈怀疑它不适用于您的情况的原因是因为您float:left;在 span 元素中添加了某个地方。
Your problem replicated here.
Hence the solution is to use the inspector tool on the <span>element and find the line and erase where the float:left;is being added.
因此,解决方案是在<span>元素上使用检查器工具并找到float:left;要添加的行并擦除。

