填充不影響在Internet Explorer中的孩子

Question

是否有任何理由爲什麼填充不會影響Internet Explorer中元素的子元素（在IE 11上測試過）？

作爲一個非常簡單的例子：

main { 
 
    padding: 32px; 
 
}

<main> 
 
    <p> 
 
    This is just a test... 
 
    </p> 
 
</main>

我希望該段要被填充（這是案件中的所有現代瀏覽器我試了一下），但由於某種原因，填充在Internet Explorer中沒有效果...

任何人都可以解釋這個問題以及如何解決它嗎？我會自發地想到像main > * { padding:inherit }，但這顯然不會是最大的想法...

Answer 1

好吧，由於某種原因IE給<main>一個CSS屬性display: inline;。爲了確保它與鉻一樣的工作，只需添加display: block;給你<main>標籤。