Bootstrap 3中的按钮边距:它们来自哪里?

时间:2014-09-17 13:40:30

标签: css twitter-bootstrap-3

我正在开发一个已经安装了Bootstrap 3软件包并试图进行按钮导航的Meteor应用程序。

我注意到按钮之间有空格但是,即使我已经检查过,我也无法发现任何边缘样式属性以使其成为可能。

怎么可能?这些利润从何而来?

即使在正式的Bootstrap 3 Doc http://getbootstrap.com/css/#buttons

中,您也可以查看和检查按钮

2 个答案:

答案 0 :(得分:1)

它不是边距,而是HTML中的实际空格。

如果您在代码中将按钮放在一行上,则不会有任何间距。

有关没有间距的按钮示例,请参阅 this bootply demo 。有关详细信息,请参阅此问题How to remove the space between inline-block elements?

答案 1 :(得分:1)

问题来自CSS属性display:inline block,它强制内联元素之间的空白。它不是HTML特定问题。有关详细信息,请参阅CSS-Tricks中的这篇文章:http://css-tricks.com/fighting-the-space-between-inline-block-elements/

解决方法修复是修改@Dan发布的HTML,但这会强制您破坏标准的HTML格式,而开发人员可以解决问题并破坏您的解决方案。

一些CSS修复程序是使用浮动而不是显示:inline-block。您还可以在按钮上添加负边距以移除该空间。