Override Bootstrap CSS für 'btn-xs' mit neuer Klasse

Question

Hallo Ich bin neu in Bootstrap und möchte 'btn-xs' mit neuer Höhe Breite und Polsterung überschreiben. Im Wesentlichen wird der Button kleiner als er ist und auch der Text wird verkleinert.

Ich habe versucht, eine neue Klasse "Benutzerdefiniert" in der folgenden Codezeile hinzuzufügen, aber es wirkt sich nicht aus.

<button class="btn btn-default btn-xs custom" style=""> Filter</button> 

Bellow ist meine benutzerdefinierte CSS:

custom { 
font-size: 10px; 
padding: 1px 10px} 

Ich bin wahrscheinlich etwas extrem dumm zu tun. Danke für Ihre Hilfe.

Answer 1

Versuchen Sie es mit wichtig, zum Beispiel font-size:! 10px wichtig

Answer 2

Um zu vermeiden, verwenden wichtig können Sie versuchen, um genauer zu sein.

Die Schaltfläche werden wahrscheinlich von dieser Regel in der Bootstrap CSS gesetzt betroffen:

.btn-group-xs>.btn, .btn-xs { ... } 

Versuchen:

.btn-group-xs>.btn.custom, .btn-xs.custom { 
font-size: 10px; 
padding: 1px 10px}