【HTML5】IE11でwidthが効かない⁉︎ mainタグが原因だった
2016年12月25日
html5でコーディングをしていて、コーディング後のブラウザチェックをしていると、IE11で崩れている!widthを指定しているのに要素が横幅いっぱいに広がっている! ということがありました。
IE7、8など旧バージョンならわかるのですが、IE11で!?
びっくりしたのですが調べてみると、html5のmainタグを使っていたことが原因でIE11で崩れが起きていました。
mainタグは、IE11でではブロック要素として認識されないようで、対処方法として、mainタグにdisplay: inline-block; を指定してあげることで簡単に解決できました。
css
.sample{
display: inline-block;
}
新しいタグを使用すると、新しいブラウザでも不具合がおきてしまうことがあるんですね^^;
気をつけましょう!
参考サイト:
http://qiita.com/rukiadia/items/9c8191590dc151d6ae85