อิทธิพลของความกว้างเปอร์เซ็นต์ของผู้ปกครองต่อการบีบอัดบล็อก flex ใน CSS

สมมติว่าตอนนี้เรามีองค์ประกอบ flex ห้าองค์ประกอบ จัดวางในแถวเดียว ลองกำหนดความกว้างให้กับผู้ปกครอง เป็นเปอร์เซ็นต์ และตั้งค่าความกว้างให้กับทุกลูกทั้งหมด เป็น 100px

เปิดตัวอย่างด้านล่างและลดขนาด หน้าต่างเบราว์เซอร์ลง จนองค์ประกอบหยุด พอดีในผู้ปกครอง ในการทำเช่นนี้ หน้าต่างต้องถูก บีบให้แคบกว่า 500px เนื่องจากเรามี 5 องค์ประกอบ แต่ละอัน 100px อย่างที่คุณ ทราบแล้ว เมื่อถูกบีบเช่นนี้ เบราว์เซอร์จะบังคับ ลดความกว้างขององค์ประกอบให้น้อยกว่า 100px เพื่อให้พวกมันพอดีในผู้ปกครอง ตัวอย่างคือดังนี้: