Flexbox Layout Aufteilung

[Gunnar Bittersmann]

@@beatovich

Gibt es daher eine Möglichkeit eine Flexbox zu erstellen, welche genau so breit ist wie die beiden bestehenden Flexbox Spalten zusammen?

Ja. Verwende einfach die Breite der Flexbox für width deines Diagramms.

Oh, eventuell meinst du, ist es möglich, ein flex-item der Breite 100% zu erstellen?

flex: 1 1 100%;

Kann man für das Temperatur-Dingens machen, muss man aber nicht. Bei der gegebenen Konstellation kann man 1 1 50% für alle Flexitems angeben; das letze macht sich dann schon so breit wie es kann.

Voraussetzung dafür ist natürlich flex-wrap: wrap für die Flexbox sowie box-sizing: border-box zumindest für die Flexitems.

Sieht dann so aus: Codepen

Frage allerdings, muss das überhaupt Teil der Flexbox sein?

Wie willst du es anstellen, dass es kein Teil der Flexbox wäre – ohne zusätzliches Markup?

LLAP 🖖