Η Επίδραση του Πλάτους του Γονέα σε Ποσοστά στη Συσπείρωση των Flex Μπλοκ στο CSS

Ας υποθέσουμε ότι έχουμε πέντε flex στοιχεία, τοποθετημένα στη σειρά. Ας ορίσουμε το πλάτος του γονέα σε ποσοστά, και σε όλα τα παιδικά στοιχεία ας ορίσουμε πλάτος 100px.

Ανοίξτε το παράδειγμα παρακάτω και μειώστε το παράθυρο του browser έτσι ώστε τα στοιχεία να μην χωράνε πλέον στον γονέα. Για να το κάνετε αυτό, το παράθυρο πρέπει να συμπιεστεί λιγότερο από 500px, αφού έχουμε 5 στοιχεία το καθένα 100px. Όπως γνωρίζετε ήδη, με τέτοια συμπίεση το browser θα μειώσει υποχρεωτικά το πλάτος των στοιχείων λιγότερο από 100px έτσι ώστε να χωρέσουν στον γονέα. Λοιπόν, ακολουθεί το παράδειγμα: