2015-01-26 9 views
9

Ich möchte für diesen Code benutzerdefinierte Symbol (ionicons) Größe einzustellen:Ionic Rahmen kann nicht eingestellt Schaltfläche Icongröße

<button class="button button-icon icon ion-stop customIconSound"></button> 

Für Klasse customIconSound Ich habe versucht folgende:

button.customIconSound,button.button-icon { 
    font-size: 52px !important; 
    color: #fff; 
    line-height: 55px!important; 
} 

Aber ohne Glück. Wenn ich Icon-Klasse ohne die Schaltfläche button-icon Klasse ich Born versucht, dass es funktioniert, aber ohne Schaltfläche Klassensymbole hat nicht gedrückt Zustand (weil es keine Schaltfläche ist).

Wie kann ich es bitte lösen?

Vielen Dank für jeden Hinweis.

Antwort

3

Ihr Beispiel funktioniert here.

Vielleicht wird Ihr Problem durch etwas anderes verursacht.

PS: Wenn Sie nur die Größe des Symbols ändern möchten, ist diese CSS-Zeile ausreichend.

.customIconSound { 
    font-size: 52px; 
} 
6

Wenn Sie Ihr Problem noch nicht gelöst haben oder für Leute, die sich damit in Zukunft beschäftigen.

Sie haben für i Pseudo-Element CSS-Stil ändern: vor

button.customIconSound i:before { 
    font-size: 52px !important; 
} 
15

Lucas Nähe war, aber die korrekte Syntax ist dies eine

button.customIconSound:before { 
    font-size: 22px !important; 
} 
+0

Dies funktioniert nicht für mich .. :( – Vandervidi

+0

Das ist perfekt, thx @Vandervidi Ersetzen „customIconSound“ mit dem Klassennamen Ihres Elements und sollte es funktionieren. –

0

Versuchen button-icon Klasse aus regiert. Diese CSS-Klasse war der Ärger in meinem Fall. Ebenso funktionierten CSS-Stile auch am Button-Tag. Zum Beispiel:

<button class="button button-clear ion-edit" style="color:#fff; font-size:22px"></button> 
Verwandte Themen