CSS Style wird nicht vererbt

[Gunnar Bittersmann]

@@Christian

Siehe hier: https://www.hoerspiel-paradies.de/color_test.html

Was ich da auf https://www.hoerspiel-paradies.de sehe, sind haufenweise graue Linien. Sollte das Schrift sein? Etliche Male [⌘][+] gedrückt – ja, es ist Schrift. Dummerweise passt die Seite auf lesbare Größe gezoomt nicht mehr in den Viewport; man muss horizontal hin- und herscrollen.

Die gute Nachricht ist: Das ist leicht behoben. Einfach für im Stylesheet bei den Regeln für .smallfont, .normalfont, .input, ul.header li und input[type="button"], input[type="submit"], input[type="reset"] die Zeile mit font-size entfernen.

Bzw. für die letzten beiden, wenn du an acp/css/style_structure.css?v33 nicht ran willst, in deinem Stylesheet überschreiben:

ul.header li, input[type="button"], input[type="submit"], input[type="reset" {
  font-size: revert !important;
}

Dann sind deine Seiten schon lesbarer. Der Zeilenabstand sollte aber noch vergrößert werden: Bei .smallfont und .normalfont (da, wo du font-size entfernt hast), line-height: 1.4 einfügen. Oder gesammelt:

.smallfont, .normalfont {
  line-height: 1.4;
}

(Mich wundert, dass einmaliges body { line-height: 1.4 } nicht geht. Möglicherweise wird auch das im Quirks-Modus nicht durchgereicht?)

---

Und das nächste Mal erstellst du bitte ein Online-Beispiel!

Naja, der Code steht ja komplett oben. Wusste nicht, dass ich da noch mehr hätte zeigen müssen.

Sollte sich jeder, der sich anschickt, dir zu helfen, erst aus deinem geposteten Code ein Beispiel erstellen müssen, um zu sehen, was der Code tut? Nein. Das Beispiel solltest du erstellen, um es den Helfenden einfacher zu machen.

---

Und du hast zu stark vereinfacht: bei Layout-Tabellen gehört role="presentation" ans table-Element, wie ich’s im Codepen gezeigt habe.

Noch nie gehört. Frag mich auch, wie das mein Problem lösen soll.

Gar nicht. Es löst ein Problem (einiger) deiner Seitenbesucher.

Ein Screenreader sollte eine Layout-„Tabelle“ nicht als Tabelle ansagen. Genau das wird durch <table role="presentation"> erreicht.

🖖 Живіть довго і процвітайте