JS Code in float ausrichten Hilfe benötigt

  • Hallo ich benötige Hilfe bei der Ausrichtung dieses 3 Elemente


    Ich will das dieser Code nur 3 Mal nebeneinander Zentriert mit flexbox


    Will das der Content oben genau so zentriert ist wie da



    Danke schon mal im vorraus

  • Willst du also dreimal den den Slider da nebeneinander eingebaut haben ?

    Verstehe ich das richtig ?

    Wo kommst du den nicht weiter ?

    Du hast ja oben dein Slider 1 mal und unten den Code womit mit man 3 boxen nebeneinander bekommt.

    Mehrbrauch man eigentlich nicht.

    Hast du es den schon mal versucht das selbst hinzu kriegen´ ?


    EDIT:

    Du brauchst da ja nicht viel machen.

    3 mal die Container kopieren,einen Container rum herum bauen , dann noch etwas css anpassen und schon gehts.

    Habe 5 minuten gebraucht weil ich erst testen wollte ob es wirklich so einfach ist wie ich es behauptet habe.


    Versuch mal dein Glück und wenn du nicht weiter kommen solltest gebe ich dir Link.

    Aber bitte erst selbst versuchen

  • Danke habs schon geschafft, aber weißt du vil wie ich die bilder mit skallieren kann also das heißt das die bilder größer oder kleiner werden wenn der browser skaliert wird?

    Danke LG

  • Also mit solchen inline-style angaben ehr nicht

    Code
    1. width="300" height="200"

    du must da schon mit Pronzenten oder vw arbeiten, dann wachsen die Bilder mit wenn das Fenster größer oder kleiner wird.

    Bei sehr kleinen Bildschirm sollte man vieleicht auch @mediqueries benutzen dann kann man die Bilderr unter einannder anordnen wenn der Bildschirm zu klein wird um alle Bilder nebeneinander anzeigen zu lassen

  • Also das mit den 3 Slider nebeneinander ist ja nicht das Problem gewesesen,

    das hast du ja auch so weit hinbekommen.

    Dann aber Slider mit den Bilder responsiv zu machen ist gar nicht so einfach.

    Das geht an besten wenn alle Bilder gleich groß sind und beim sich auch gleichmäßig ohne großartig zu verzerren kleiner und größer schieben lassen..


    Ich habe jetzt nicht großartig auf Bilder geachtet weil responsive Bilder noch nie mein ding wahr

    https://codepen.io/basti1012/pen/XLGWgv?editors=1100


    So kannst du aber sehen was ich meine.

    Die Bilder wachsen nach oben und zur Seite mit, und an einer gewissen höhe springen die Slider übereinander


    Wenn du geschoben hast ist der blaue Punkt ( Slider ) nicht mehr da wo er hinsoll.

    Du mußt dann die Seite reloaden . Um den Punkt an der richtigen stelle zu bekommen brauchst du ein resize() event.

    Wenn man das richtig einbauen tut geht das auch.


    Wenn du jetzt vor hast die Slider responsiv zu machen , dann Frag mal in anderen Thema nach was du aufgemacht hast . Sempervivum kennt sich mit den Resonsiven Bilder Zeug gut aus.

    Wenn einer die Bilder da responsiv rein bekommt dann er.

    Mit einfarbigen Bilder kann ich das auch :D , aber Gesichter Häuser und was weiß ich alles müßen die maße ja stimmen.


    Nomalerweise wenn man width:300px angibt wird die höhe automatisch angepasst.

    Bei verschieden große Bilder wären die Slider auch verschieden hoch.

    Das willst du ja bestimmt auch nicht.


    Also wie gesagt. Wenn man die Bilder da responsiv in die Slider rein bekommt dann solte der rest auch alles klappen