我有以下html div代码适用于Chrome,FireFox和MS Edge,但在IE10上,输出堆叠在彼此之上。基本上三个flexbox列div按升序排列。
在工作的浏览器上,它们是一个接一个地布局,这就是我想要的。是修复IE10问题的一种方法吗?谢谢。
<div class="container">
<div fxLayout="column" fxLayoutAlign="center center" style="text-align:center" >
<div fxFlex="grow" fxFlexAlign="center" *ngIf="QrCode && !QrCompleted">
{{DisplayCode}}
</div>
<div fxFlex fxFlexAlign="center" *ngIf="loginCode && !loginCompleted">
<p>Display Count: {{cnt}} </p>
<h1>Get Login Code from SMS to Login</h1>
<p> {{errorMessage}} </p>
</div>
</div>
<div fxLayout="column" fxLayoutAlign="center center" *ngIf="LoginCompleted">
<div fxFlex="grow" >
<button style="height:50px; width:200px" (click)="onClick()">Click for New Code</button>
</div>
</div>
<div fxLayout="column" fxLayoutAlign="center center" >
<div fxFlex="grow" >
<a href="https://www.example.com/store" target="_blank">
<img src="../assets/companylogo.svg" alt="Logo" height="100px" width="400px" >
</a>
</div>
</div>
</div>