Gunnar Bittersmann: Problem bei wrapping in flex container

Beitrag lesen

@@marctrix

Die Frage war bereits beantwortet: „mit media-queries“

Das ist beantwortet die Frage genausowenig wie „Mach das Garagentor auf“ die Antwort auf die Frage „Wie fahre ich ein Auto?“ ist.

Media queries geben an, wann bestimmte Stilangaben wirken. Fehlt nur noch eine Kleinigkeit: was bewirkt werden soll.

Innerhalb von media queries steht die Umsetzung: eben mit Flexbox oder Grid oder der Hack mit Floats.

Ich brauche 1 Minute oder so für das hier

Ja, das sieht man dem auch an! Du hättest wenigstens noch eine Minute darüber nachdenken sollen, was da noch so alles fehlt:

  • Die Bilder sollen abwechselnd links und rechts stehen, also float: left bzw. float: right

  • Der Text soll neben den Bildern stehen, nicht die Bilder umfließen. (Weshalb Floats hier ein Hack sind.) Der Text braucht also auch float oder margin.

  • Wenn keine unschönen Sachen bei kurzen (oder langen) Texten passieren sollen, muss unbedingt noch ein clear her. (Das kommt davon, wenn man Hacks statt vernünftigen Lösungen verwendet.)

Und als Ergebnis kommt dann eine Lösung, die keineswegs schneller umsetzbar ist

Wenn man das mit Floats umsetzen will und alles bedenkt, was dabei zu bedenken ist, dauert das auch länger als eine Minute. Von der Fehleranfälligkeit des Hacks gar nicht zu reden.

Wenn man sich in Flexbox und Grid einarbeitet, wird man auch damit schnell. Und kann davon bei zukünftigen Projekten zehren.

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory