IE11でサイドバー用にmainタグにpaddingを入れたのに効かない件
IE11だけmainタグにpaddingが効かない、mainタグ内の子要素が軒並み親要素をはみ出してうまく表示されない。( はみ出してるように見えただけでpaddingが効いてないだけでした。 ) しばらくハマったので調べてみた結果メモ。 こんな感じでサイドメニューとメインコンテンツを配置。メインコンテンツのmargin、もしくはpaddingをサイドメニューのwidth分指定したかった。 ChoromeやFirefox、Edgeでも思った通りに表示されているのにIEだけダメ。結果としては、IE11ではmainタグ自体がinlineになっているようで、こいつを以下のようにすれば対処可能のようです。 ただ、mainタグ自体にスタイルを当てるのはちょっと怖いなと思ったので、mainタグ以下をdivなどでwrapper要素を作った方が良さそうだなと思いました。