Дочерний элемент 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 результат: