the onishimemo

IE11でflex-directionでcolumn/column-reverseを指定すると画像の下にに空白ができる

タイトル通りですが、flex-directionでcolumn/column-reverseを指定するとIE11で見た時、画像の下に大きな空白ができて絶望しました。

画像の親要素にmin-height: 0%;を指定したらいいという記事を見かけたのですが、私の環境では0%を指定しても変化がなく、1pxを指定することで解消することができました。

.flex
  .img-wrap
    img(src="hoge.jpg", alt="")
  .img-caption
    | Lorem ipsum dolor sit amet

↑この場合の.img-wrapにmin-height: 1px;を指定

IEにいつまで振り回されたらいいんだ…

/