nicht angemeldet
Hallo,
du hast leider einige Probleme eingebaut.
Das Problem ist die Breite der article-container. Lösch mal "flex: 1 1 0;" und trage statt dessen ein "width: 33.3%". Dann kann sich die Breite der article dem übergeordnetem Element anpassen.
Allerdings gibt es dann ein weiteres Problem. Du hast fälschlicherweise den rechten Abstand der beiden linken Container mit einem padding-right hergestellt. Das wird von den 33.3% abgezogen und die beiden linken Spalten sind entsprechend schmaler, die beiden Bilder natürlich auch kleiner. Für einen Abstand von Elementen untereinander ist margin gedacht.
Korrekterweise musst du also das padding entfernen und durch ein margin ersetzen. Wobei die 33.3% entsprechend verringert werden müssen.
Wobei das Flexbox-Modell auch bei Breiten über 100% die Gesamtbreite auf 100% anpasst. Trotzdem ist es sinnvoll die Gesamtbreite selbst auf insgesamt 100% zu setzen, man weiß ja nie.
Wenn du padding benötigst sollte das für alle article gleich vergeben werden, damit die Breiten gleich bleiben, entsprechend dem border-box-Modell.
Gruss
MrMurphy