IE11에서 Flexbox 문제가 발생했습니다.

Question

IE 버그 목록에서이 문제를 해결하려고 시도했지만 거기에서 찾을 수 없습니다. 내부 요소 (.inner) - flex: 1에 대한 축약 형 플렉스 선언을 피함으로써 해결됩니다. ->flex: 1 1 auto;.

제발 도와 주실 수 있습니까?

.flex-container { 
 
    display: flex; 
 
    flex-flow: row wrap; 
 
} 
 

 
.flex-item { 
 
    display:flex; 
 
    flex: 1; 
 
    flex-direction: column; 
 
    outline: 1px solid; 
 
} 
 

 
.inner { 
 
    flex: 1; 
 
}

<div class="flex-container"> 
 
    <div class="flex-item"> 
 
    <div class="inner"> 
 
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ipsam quidem cum quod, sed iure aspernatur enim nihil vitae eos ullam molestias possimus quia repellat, delectus, rem est quibusdam. Ipsum, perspiciatis. 
 
    </div> 
 
    </div> 
 
    <div class="flex-item"> 
 
    <div class="inner"> 
 
    lorem 
 
    </div> 
 
    </div> 
 
    <div class="flex-item"> 
 
    <div class="inner"> 
 
    lorem 
 
    </div> 
 
    </div> 
 
    <div class="flex-item"> 
 
    <div class="inner"> 
 
    lorem 
 
    </div> 
 
    </div> 
 
    </div>

사실 문제 Flex items overflowing parent in IE11

Answer 1

flex: 1 0 auto 대신 flex: 1

고정이 문제