Flexbox
bearbeitet von Christian KruseHallo Gunnar,
> Ich hätte gern, dass das erste Flexitems allein in seiner Spalte steht, ohne jedoch die volle Höhe zu haben. Hab ihm deshalb `margin-bottom: 100%` verpasst.
> Bekomme ich das Layout auch anders als mit `margin-bottom: 100%` hin?
Da könntest du ein Pseudo-Element setzen (kein CodePen weil es mich nichts speichern lassen will ohne Registrierung):
~~~ css
#no1
{
background-color: hsl(0, 100%, 40%);
flex-basis: 6em;
order:-1;
}
body > div::after {
order:-1;
flex:0 100%;
content:"";
height:100%;
background-color:#777;
}
~~~
Damit kann man aber halt nur maximal zwei Breaks erzwingen. Und schön ist anders; leider ist die vorgesehene Lösung (`break-after`/`break-before` bzw `page-braek-after`/`page-break-before`) noch nicht besonders verbreitet, IIRC kann das nur der Firefox.
LG,
CK
--
<https://wwwtech.de/about>