Wie gibt man font-awesomes icon eine feste Breite?

8

Ich verwende Bootstrap und Font Awesome , um eine Tabelle wie die von FAQ zalando zu erstellen.

Also sollte auf der linken Seite ein Symbol stehen und auf der rechten Seite sollte Text sein.

Ich möchte, dass der Text genau unterein- ander steht, sie sollten nicht zueinander in einer Linie liegen. Wenn ich den Symbolen einen Bereich gebe, wird dieser ignoriert.

Hier ist mein Code:

%Vor%     
Brigitte Fellner 30.08.2013, 14:43
quelle

4 Antworten

0

Setzen Sie Ihr Icon in das Element und lassen Sie es sich wie ein inline-block verhalten, damit Sie seine width und margin ändern können.

Ссылка

    
LeBen 30.08.2013, 14:50
quelle
34

Als Update hat FontAwesome nun eine feste Breite eingebaut.

%Vor%

Die Klasse fa-fw liefert den Stil mit fester Breite.

    
mwotton 02.09.2014 06:55
quelle
2

Sowohl der Original-Code der Zalando-Website als auch der Fiddle von LeBen sind nicht "ideal" - vor allem wenn es um HTML-Semantik geht.

Warum sollten Sie leere Elemente haben, wenn Sie nur ein Hintergrundbild für ein Element wünschen?

Fügen Sie einfach das Symbol als Hintergrundbild hinzu und setzen Sie den Padding-Link für alle diese Elemente auf den gewünschten Wert.

    
Netsurfer 30.08.2013 15:04
quelle
0

Greifen Sie einfach auf die Klassen der Symbole zu, und fügen Sie Ihre Stile direkt in css hinzu:

%Vor%

Und es gibt keine Notwendigkeit für eine leere, nur zu verwenden:

%Vor%     
Seth Warburton 20.08.2014 13:44
quelle