So vermeiden Sie Zeilenumbrüche nach ": before" in CSS

Question

So vermeiden Sie Zeilenumbrüche nach ": before" in CSS

8

Auf meiner Website verwende ich Schriftarten für bestimmte Linktypen. Diese Symbole werden über :before CSS-Syntax hinzugefügt.

%Vor%

Wenn diese Verknüpfung jedoch am Anfang einer Zeile steht, wird sie manchmal von ihrem Symbol getrennt:

Ich habe versucht, white-space: nowrap zur obigen CSS-Regel hinzuzufügen, aber das hat nicht geholfen.

Wie behalte ich das Symbol und den Text zusammen? (CSS 3 ist in Ordnung)

Hinweis: Ich möchte den ganzen Link nicht mit white-space: nowrap formatieren.

css css3 css-content

Sebastian Krysmanski 13.02.2013, 10:24

quelle

2 Antworten

2

Es ist viel besser, nowrap rule zu :before css hinzuzufügen:

%Vor%

UPD: Ссылка

Der Grund für die nowrap -Regel besteht darin, mit dem Bildinhalt in :before ordnungsgemäß zu arbeiten. Textinhalt braucht diese Regel nicht, um in der Nähe des Hauptelements zu bleiben.

ornic 16.07.2014 15:25

quelle

Tags und Links css css3 css-content

Django: Verwenden von Annotate, Count und Distinct in einem Queryset Data Protection / NSFileProtectionComplete - Erfolgreich unterstützt durch die Datei "anpassungen.plist"?

score 8 · Accepted Answer

Das Entfernen des display:inline-block; scheint dieses Problem zu beheben:

%Vor%

JSFiddle .

Leider brauchst du "display: inline-block", um SVG anzuzeigen. Eine einfache Lösung besteht darin, "display: inline-block" auf "a" zu setzen. Dies wird dazu führen, dass Ihr SVG richtig rendert und es Ihr a: vor und das a zusammen auf einer Zeile hält.