内联块父级内的Flex子级-IE11无法处理布局对齐方式

Question

以下代码在IE11上的行为有所不同。就像锚标签被推上了，垂直对齐似乎不太正常

   <a href="www.mysite.com" style={{display: 'inline-block'}}>
      <div style={{display: 'flex'}}>Text inside wrapper</div>
   </a>
   <span>Blah blhsdf ksdhf sksfh</span>

Chrome /其他浏览器

IE11

Answer 1

同意G-Cyrillus，尝试如下修改您的代码（添加vertial-align css property：]

   <a href="www.mysite.com" style={{display: 'inline-block'; vertical-align:'top';}}>
      <div style={{display: 'flex'}}>Text inside wrapper</div>
   </a>
   <span>Blah blhsdf ksdhf sksfh</span>

IE 11结果：