พิจารณาตัวอย่างต่อไปนี้:
.parent {
display: flex;
flex-direction: column;
width: 400px;
border: 1px solid red;
align-items: center;
}
.child {
border: 1px solid blue;
}
<div class="parent">
<div class="child">
Lorem Ipsum is simply dummy text of the printing and typesetting industry
</div>
<div class="child">
Lorem Ipsum is simply dummy text of the printing and typesetting industry
</div>
</div>
ใน Chrome ข้อความจะถูกห่อตามที่คาดไว้:
แต่ใน IE11 ข้อความไม่ได้ห่อ :
นี่เป็นข้อบกพร่องที่รู้จักใน IE หรือไม่ (ถ้าใช่ตัวชี้จะได้รับการชื่นชม)
มีวิธีแก้ไขเฉพาะหน้าหรือไม่?
คำถามที่คล้ายกันนี้ไม่มีคำตอบที่ชัดเจนและตัวชี้อย่างเป็นทางการ
align-items: center
จากองค์ประกอบหลัก ดูเหมือนว่าจะเป็นสาเหตุของมัน