Przyciski o stałej szerokości z Bootstrap

182

Czy Bootstrap obsługuje przyciski o stałej szerokości? Obecnie, jeśli mam 2 przyciski „Zapisz” i „Pobierz”, rozmiar przycisku zmienia się w zależności od zawartości.

Jaki jest właściwy sposób rozszerzenia Bootstrap?

css twitter-bootstrap

— aWebDeveloper
źródło

Czy przez stałą szerokość rozumiesz, że nie rośnie ona wraz z zawartością w niej? Przyciski są ograniczone tylko zawartym w nich tekstem.

— Andres Ilich,

@AndresIlich Obecnie Jeśli mam 2 przyciski „Zapisz” i „Pobierz”, rozmiar przycisku zmienia się w zależności od zawartości

— aWebDeveloper

Czy chcesz, aby te dwa przyciski o tej samej szerokości były prawidłowe?

— Andres Ilich,

stackoverflow.com/questions/10459808/…

— trante

318

Możesz także użyć .btn-blockklasy na przycisku, aby rozszerzyła się do szerokości rodzica.

Jeśli element nadrzędny jest elementem o stałej szerokości, przycisk zostanie rozwinięty, aby objąć całą szerokość. Możesz zastosować istniejące znaczniki do kontenera, aby przyciski stałe / płynne zajmowały tylko wymaganą przestrzeń.

<div class="span2">
<p><button class="btn btn-primary btn-block">Save</button></p>
<p><button class="btn btn-success btn-block">Download</button></p>
</div>

Pokaż fragment kodu

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />


<div class="span2">
  <p><button class="btn btn-primary btn-block">Save</button></p>
  <p><button class="btn btn-success btn-block">Download</button></p>
</div>

Rozwiń fragment kodu

— Kami
źródło