@@Rolf B
Ein kurzer Exkurs zu den verwendeten Maßeinheiten vh, vmin und fr wäre auf jeden Fall ebenfalls wichtig gewesen - wie soll Shezua sonst verstehen, was da passiert?
Nein.
Was mein Beispiel samt Erklärung beïnhalten sollte: eine (maximale) Breite und horzontale Zentrierung der Bildergalerie-Box. War beim Tabellenlayout im OP ja auch so, dass die Bilder mittig sein sollten. Nur dass ich das dann gleich richtig™ gemacht habe, dass sich die Box bei schmalem Viewport verkleinert.
Dazu brauchte ich irgendeinen Wert für max-width
. Ich habe mich (aus rein ästhetischen Gründen) als Gimmick für denjenigen Wert entschieden, der das von dir beschriebene Verhalten erzeugt. Aber:
Was mein Beispiel samt Erklärung nicht beïnhalten sollte: einen Exkurs zu Maßeinheiten inklusive irgendwelcher Berechnungen. Das hätte völlig vom Thema abgelenkt und wohl schon angesichts der Länge Shezua davon abgehalten, da überhaupt einzusteigen.
Wie ich schon schrieb, war hier allein die Erkenntnis von Bedeutung, dass die 2
in repeat(2, 1fr)
für die 2 Spalten steht. Was 1fr
ist, ist an der Stelle gar nicht von Belang.
Vor allem wäre der Hinweis wichtig, wie Du auf die 65vh gekommen bist - experimentell?
Ja.
Das hätte ich als Randnotiz erwähnen können, für „wichtig“ halte ich den Hinweis hier nicht, weil dieses Gimmick nicht Teil des Problems ist. Wie gesagt, es hätte auch irgendein anderer Wert sein können.
Ich hab hinterher nachgerechtet und komme auf 64⅔, denn …
um das Padding des body und das gap im Grid zu kompensieren
… das horizontale Padding des body fließt in die Berechnung der Breite nicht ein – ich hatte diesmal doch glatt vergessen, * { box-sizing: border-box }
zu setzen.
LLAP 🖖
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory