Flex-Items um eigene Breite verschieben

[j4nk3y]

Guten morgen zusammen,

Ich hänge seit ein paar Tagen an einem Problem, welches sich für mich nicht völlig erschließt. Folgendes Szenario, wie man sieht versuche ich mittels Jquery Flex-Items um ihre eigene Breite nach Links zu verschieben, sodass alle die selbe Position haben. Sobald jedoch die Items die Eigenschaft flex: 1; bekommen, fällt das Ergebnis nicht so aus wie geplant. Ich würde gern erreichen, dass die Items alle auf der selben Position liegen und das sie die volle Breite des Containers einnehmen.

Dies würde sich mit position wohl einfach realisieren lassen aber leider habe ich keine absolut positionierten Container mehr in meinem Aufbau, zudem bewegt sich der Container auch noch, welches eine position Angabe auch schwierig gestalten würde.

Ich weiß, dass die Flex-Items welche flex: 1; besitzen während des foreach ihre Größe ändern und das jeweils nachfolgende Item ein kleineres margin zugewiesen bekommt aber auch die vorherige Abfrage wie breit die Container sind um sie dann um diesen Wert zu verschieben führte auch noch nicht zum erfolg.

Auch habe ich schon überlegt, Mit der Container breite Irgendwas anzustellen, Problem dabei ist nur, dass wenn die Items noch nicht dem DOM hinzugefügt wurden ist der Container nicht so groß wie er sein sollte. Und wenn Alle Items hinzugefügt wurden, ist der Container einige tausend px breit.

Danke für eure Tipps.

Gruß
Jo