如何在我的Bootstrap 4链接之间删除这些边距？

Question

我正在实现Bootstrap 4内联块链接，它们之间似乎有一个看不见的边距，我似乎无法删除。

屏幕截图：

Codepen here。

代码：

<div>
    <!-- There shoud be NO MARGIN between the links -->
    <a href="#" class="btn btn-danger">
        Button A</a>
    <a href="#" class="btn btn-secondary like-button">
        Button B
    </a>
</div>

如何摆脱这些无形的边缘？

Answer 1

您可以使用Bootstrap 按钮组，具体取决于您最终要做的事情。

<div class="btn-group" role="group" aria-label="Basic example">
   ...you buttons
</div>

请参阅Docs

工作示例：

＆＃13;

＆＃13;

/*EXAMPLE CSS ONLY, NOT QUESTION RELATED*/

body {
  padding-top: 50px;
  text-align: center;
}
/*EXAMPLE CSS ONLY, NOT QUESTION RELATED*/

＆＃13;

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" rel="stylesheet" />
<div class="btn-group" role="group" aria-label="Basic example">
  <a href="#" class="btn btn-danger">Button A</a>
  <a href="#" class="btn btn-secondary like-button">Button B</a>
</div>

＆＃13;

＆＃13;

＆＃13;

Answer 2

为按钮添加新类并使用

margin: 0 -4px 0 0;

codepen https://codepen.io/norcaljohnny/pen/BQqroO

Answer 3

那是因为按钮显示为＆＃34;内联块＆＃34;。

他们之间有一个空间，而不是边缘。您可以通过删除每个标记之间的空格/换行符来修复它：

WSGIPythonPath "/var/www/QuickSearch/QuickSearch/venv/lib64/python2.7/site-packages"
<VirtualHost *:80>
    ServerName 10.0.2.15

    WSGIScriptAlias / /var/www/QuickSearch/quicksearch.wsgi
    WSGIScriptReloading On

    <Directory /var/www/QuickSearch/QuickSearch/>
        Order deny,allow
        Allow from all
    </Directory>
</VirtualHost>

Answer 4

问题原来是链接之间的HTML中的换行符。我不确定这是故意还是某种浏览器错误。无论如何..删除换行符：

<div>
    <!-- There shoud be NO MARGIN between the links -->
    <a href="#" class="btn btn-danger">
        Button A</a><a href="#" class="btn btn-secondary like-button">
        Button B
    </a>
</div>