Rolf B: Grid - Spaltenbreiten limitieren

Beitrag lesen

Hallo Gunnar,

ja, Annahme ist richtig. Aber wieso triffst Du Annahmen, hast Du Dir das Fiddle nicht angeschaut?

Ich meine, klar, Flexbox ist oft eine Alternative, aber ich müsste dann ein Dummy-Div um die rechte Spalte legen, weil die aus 2 Elementen besteht. Insbesondere müsste ich die rechte Spalte dann als vertikale Flexbox auslegen, mit flex:1 für das obere Element, um das gleiche Verhalten zu erreichen (Fiddle mit Gegenüberstellung Grid/Flex).

So soll es sich verhalten:

"UltraBreit-Darstellung": 1fr 30em (limitiert durch max-width am body, die bbbbb Zeile ist Leerraum wenn BBB nicht hoch genug ist - die Höhe von CCC soll auf max-content limitiert sein)

AAAAAAAAAAAAAA BBBBBBBB
AAAAAAAAAAAAAA BBBBBBBB
AAAAAAAAAAAAAA BBBBBBBB
AAAAAAAAAAAAAA bbbbbbbb
AAAAAAAAAAAAAA CCCCCCCC

"Breit-Darstellung" 1fr 1fr

AAAAAA BBBBBB
AAAAAA BBBBBB
AAAAAA BBBBBB
AAAAAA BBBBBB
AAAAAA BBBBBB
AAAAAA CCCCCC

"Schmal-Darstellung" 1fr, per @media-Query

AAAAAAA
AAAAAAA
AAAAAAA
AAAAAAA
BBBBBBB
BBBBBBB
BBBBBBB
CCCCCCC

Ich könnte natürlich auch für die Ultrabreit-Darstellung (ab 2×30em+gap) eine @media-Query machen. Dann hätte ich eine magic number drin, gefällt mir nicht.

Eigentlich frage ich mich ja nur, ob ich zu blöd bin, um die Spaltendefinitionen für Grids zu verstehen, oder ob das tatsächlich so umständlich sein muss.

Rolf

--
sumpsi - posui - obstruxi