[Erledigt] Flex-Box mit dynamischem und fixed Spalten

  • Hallo zusammen,


    ich habe da mal ein Problem, an dem ich mir gerade die Zähne ausbeiße, Blackout.


    In einem Container habe ich drei Spalten, ein Image, Text und ein Button. Ist der Container breiter als 800px, sollen alle drei Spalten nebeneinander sein. Das ist ja noch kein Problem. Wenn der Container aber kleiner als 800px wird, soll der Button tiefer rutschen und unter dem Text stehen und nicht unter dem Image. Habe mal ein Bild dazu gepackt, damit ihr besser versteht, was ich meine.


    flex.png


    Danke für jeden Tipp

    M.Scatello

    Alles unter dem Strich ist eine Signatur!


    Die Deutsche Rechtschreibung ist Freeware, sprich, du darfst sie kostenlos nutzen. Allerdings ist sie nicht Open Source, d.h. du darfst sie nicht verändern oder in veränderter Form veröffentlichen!


    Zitat von Dieter Nuhr: "Wenn man keine Ahnung hat, einfach mal Fresse halten". Wie recht er doch hat...

  • Nur eine Idee.. warum setzt du nicht zwischen dem Text und dem Button einen weiteres, leeres DIV, dass über 800px eine Breite von 0px hat und bei kleineren Bildschirmen so breit wird, wie das Bild? Das gewünschte Verhalten sollte sich dann mit 'flex-wrap' und etwas testen einrichten lassen.

  • Danke Sailor

    habe aber gerade die Lösung zusammengebastelt:

    Alles unter dem Strich ist eine Signatur!


    Die Deutsche Rechtschreibung ist Freeware, sprich, du darfst sie kostenlos nutzen. Allerdings ist sie nicht Open Source, d.h. du darfst sie nicht verändern oder in veränderter Form veröffentlichen!


    Zitat von Dieter Nuhr: "Wenn man keine Ahnung hat, einfach mal Fresse halten". Wie recht er doch hat...

  • Danke Arne Drews

    deine Lösung ist natürlich noch eleganter. Aber mit dem fixed Margin ist das nicht ganz so dramatisch, da das Image immer eine feste vorgegebene Größe hat.

    Alles unter dem Strich ist eine Signatur!


    Die Deutsche Rechtschreibung ist Freeware, sprich, du darfst sie kostenlos nutzen. Allerdings ist sie nicht Open Source, d.h. du darfst sie nicht verändern oder in veränderter Form veröffentlichen!


    Zitat von Dieter Nuhr: "Wenn man keine Ahnung hat, einfach mal Fresse halten". Wie recht er doch hat...