公開2015.08.07 更新2017.12.03 仕事・技術 Windows10が発売されて新ブラウザのEdgeが使えるようになっても、まだまだInternetExplorerの呪縛からは逃れられません;; 今回はフロートを使ったレイアウトではなく今後主流になってくる「フレキシブルボックス」でのレイアウトで発生した問題です。 以下のようなコードがあるとします。 <div id="flexParent"> <header>ヘッダー</header> <main> <div class="flexChild left">左</div> <div class="flexChild right">右</div> </main> <footer>フッター</footer> </div> よくあるカタチで、縦並びにヘッダー、メインコンテンツ(左右に2カラムあるとします)、フッターがあります。 これら
![IE11でflexboxの縦幅がおかしい時はflexプロパティの書き方が原因かもしれない](https://cdn-ak-scissors.b.st-hatena.com/image/square/17c0178dadb4b8d8953235f6a93bbecb5b8717ac/height=288;version=1;width=512/https%3A%2F%2Flive.staticflickr.com%2F65535%2F51787557656_cfd26df5b5_b.jpg)