CSS Maximale Breite mit Flex Layout erzwingen (Tailwind)

[Rossie]

Wie schaffe ich es, die Breite der roten (fast leeren) Box auf die Breite der blauen mit Inhalt zu bringen? Eine feste Breite ist nicht möglich, da das ganze responsive sein soll.

https://play.tailwindcss.com/mJbY8FRz9i

Ziel ist letztlich, dass alle Boxen am linken Rand immer gleich ausgerichtet sind. Zu 100% will mir das nicht gelingen. Es muss also nicht immer die gleiche Breite sein, das erscheint mir aber als beste Lösung.

 

[floq0r]

Link broken.

 

[zenokortin]

https://play.tailwindcss.com/mJbY8FRz9

gibt nen 404

Ergänzung (17. Oktober 2023)

1. Du solltest auch was schreiben, wenn du den Link updatest, sonst bekommt das keiner mit!
2. Puh, Tailwind ist ja grausig.
3. lg:w-[44rem] statt lg:max-w-[44rem] hilft zumindest in dem einen Fall, denke das ist zumindest ein Denkansatz.

 

[michi174]

Bau dir einen Container rundum, mit der Breite die du erreichen möchtest.
In deinem Fall wahrscheinlich die 44rem.

Dann stellst du die Breite des roten und des blauen containers auf 100% und sie sind immer gleich breit.
Ausrichten kannst du es dann ja mit den flex-properties des Hauptcontainers