Gunnar Bittersmann: text-align Problem.

Beitrag lesen

SELF-Forum

text-align Problem.

Gunnar Bittersmann Homepage des Autors (Versionen)
– Informationen zu den Bewertungsregeln

problematische Seite

@@Simon Teidt

Du hast zwar mit li { list-style-type: none } die Bullets entfernt[1], damit wird aber immer noch der Platz dafür freigehalten. Der kommt von einer Regel im browserinternen Stylesheet – im Firefox ist es ul { padding-left: 40px }, in Chrome ist es ul { -webkit-padding-start: 40px }. Beides kannst du in deinem Stylesheet mit ul { padding-left: 0 } überschreiben.[2]

Andere Browser könnten den Abstand aber vielleicht auch mit li { margin-left: 40px } erzeugen, sodass du das ggfs. auch nullen musst.[3]

a:focus { color: red } ist gar keine gute Idee, wenn der Hintergrund rot ist. Dadurch wird der jeweils fokussierte Link bei Tastaturnavigation unsichtbar.

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory

  1. Statt für jedes li kannst du das auch für ul angeben. Das würde ich aber nicht für alle Listen tun, sondern nur spezifisch für jene, wo die Bullets weg sollen, bspw. nav ul, #ligenlinks ul { list-style-type: none } oder kurz nav ul, #ligenlinks ul { list-style: none } ↩︎

  2. Auch hier: nur für diejenigen Listen angeben, wo der Abstand weg soll. Also für dieselben, wo du die Bullets entfernst. ↩︎

  3. Dito. Also bspw. nav li, #ligenlinks li { margin-left: 0} ↩︎

Beitrag melden
–
Informationen zu den Bewertungsregeln