Frage abbr-Tag stylen?

  • Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Werbung

Jetzt auf elektrisches Fahren umstellen, Umwelt schonen und 1.500km kostenlosen Strom von Tesla bekommen. https://ts.la/carsten15473.

annsen

Mitglied
9 Juni 2016
86
2
8
39
Wenn ich das abbr-Tag nicht style, wird im Browser automatisch eine gepunktete Linie direkt unter dem Text eingefügt. Allerdings sieht das unmöglich aus - zum einen ist die Linie nicht exakt so lang wie der Text und dann hängt die Linie ohne Abstand direkt am (durch abbr) beschriebenen Text.

Ich hab versucht dem Tag eine Linie zuzuweisen
CSS:
abbr {border-bottom: 1px dotted}
aber dann sind beide Linien zu erkennen. Kann ich die automatisch vom Browser hinzugefügte Linie irgendwie entfernen?

Danke vorab für Tipps!!
 

MrMurphy

Senior HTML'ler
28 Juli 2009
1.497
221
63
Es handelt sich um eine Unterstreichung. Du empfindest sie vielleicht als ungewöhnlich, weil du in HTML / CSS nur noch border kennst. Das die Unterstreichung direkt unter dem Wort steht ist aber vollkommen korrekt. border als Unterstreichung zu mißbrauchen ist hingegen nicht korrekt. Auch wenn dies häufig zu sehen ist.

Das die Unterstreichung nicht so lang wie das Wort sein soll kann ich nicht nachvollziehen.

Kann ich die automatisch vom Browser hinzugefügte Linie irgendwie entfernen?
Ja, du kannst die Unterstreichung ändern oder auch entfernen. Erst mal eine rote Unterstreichung in Wellenform um zu zeigen, was möglich ist:

Code:
text-decoration: underline wavy red;
Die vorhandene Unterstreichung wird entfernt mit

Code:
text-decoration: none;
 
Reactions: scbawik

MrMurphy

Senior HTML'ler
28 Juli 2009
1.497
221
63
Welcher Safari? Die Entwicklung von Safari für Windows wurde bereits offiziell 2012 eingestellt. Den als negatives Beispiel für aktuelles CSS zu verwenden ist genau so unsinnig wie auf veraltete IE zu verweisen.
 

scbawik

Senior HTML'ler
14 Juli 2011
2.542
448
83
Welcher Safari? Die Entwicklung von Safari für Windows wurde bereits offiziell 2012 eingestellt. Den als negatives Beispiel für aktuelles CSS zu verwenden ist genau so unsinnig wie auf veraltete IE zu verweisen.
Na das musst du mir nicht sagen.

Safari für Mac natürlich. Der Standardbrowser von Mac OS.

Der Standardbrowser von Windows, Edge, ist laut caniuse auch nicht supported.
(Der Chromium Edge ist ja noch Beta, wenn ich mich nicht irre)

Also beide Standardbrowser der beiden Standard-OS supporten das anscheinend nicht ordentlich.

EDIT: Ok, im Safari klappts mit Vendor-Prefix
 
Werbung: