Hallo Sibold,
ja wie denn auch? Du hast nach wie vor zwei Grids, eins für das main-Element, eins für das div-Element. Und deine Variationen hast Du für das main-Grid durchgeführt.
Aber Du hast wieder mal die Welt verändert, bevor Du gespielt hast: Das div ist nun das einzige Kind des main-Elements, d.h. von den Rasterzellen des main-Grids wird nur eine belegt. Es ist also relativ egal, wieviele max-content Spalten Du definierst, ob eine, zehn oder zehn Millionen, nur die erste ist belegt und die übrigen existieren mit Breite 0.
In dieser einen Zelle ist dein div-Element, selbst ein Grid. Der Inhalt sind 3 Zellen, deren Inhalt nur aus einem einzigen Wort besteht. Also etwas, worauf min-content und max-content keinen Einfluss hat, ein Wort hat keinen Spielraum für eine Breitenvariation. Das div ist in seinen Ausmaßen daher ebenfalls festgelegt, und damit führen im main-Grid min-content und max-content ebenfalls zum gleichen Ergebnis.
Dürfte ich zum gefühlt drölften Mal erwähnen, dass hier die Entwicklerwerkzeugen deines Browsers nützlich sind, um das Grid zu visualisieren?
Rolf
sumpsi - posui - obstruxi