Przestrzeń między Bootstrap 3 przyciski

Question

Jeśli mogę umieścić kilka Bootstrap 3 przyciski z rzędu:

<button class="btn btn-default">Button 1</button> 
    <button class="btn btn-default">Button 2</button> 
    <button class="btn btn-default">Button 3</button> 

jest mała przestrzeń między nimi. Skąd się bierze i jak go usunąć bez używania float? Według Firebug i Chrome Inspector przyciski nie mają żadnego marginesu.

Answer 1

Nowy znak między przyciskami faktycznie powoduje spację. Przestrzegać:

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/> 
 

 
<button class="btn btn-default">Button 1</button><button class="btn btn-default">Button 2</button><button class="btn btn-default">Button 3</button>

Nie jest reguła przycisk grupę można użyć, jeśli chcesz przycisków zgrupowanych wizualnie: http://getbootstrap.com/components/#btn-groups

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" rel="stylesheet"/> 
 
<div class="btn-group" role="group" aria-label="..."> 
 
    <button type="button" class="btn btn-default">Left</button> 
 
    <button type="button" class="btn btn-default">Middle</button> 
 
    <button type="button" class="btn btn-default">Right</button> 
 
</div>

Answer 2

I wierz yo u styl przycisków display:inline-block; lub inline. Domyślnie tworzą spacje, jeśli masz znak nowej linii.

Aby ją usunąć, umieść te znaczniki obok siebie bez znaku nowej linii. Byłoby bałagan, ale to, co chcesz, bez konieczności styl float

Więc zrób to tak:

<button class="btn btn-default">Button 1</button><button class="btn btn-default">Button 2</button><button class="btn btn-default">Button 3</button>