如何解决跨边界高度和保证金问题

Question

我如何解决跨浏览器中的高度和保证金问题在下面简单的CSS。在Internet Explorer和Firefox中，div元素的高度大于指定的屏幕大小，而页眉与其他div元素之间或页脚与其他元素之间的边距不均匀。 **或任何网站参考表格，我更深入地了解解决方案**。在此先感谢

@media screen and (max-width: 480px) 
{ 

    html ,body 
{ 
width : 100% ; 
height :100% ; 
font-size : 1rem ; 
} 

.header ,.footer 
{ 
display : table-row; 
background : white ; 
height : 10% ; 
width : 100% ; 
overflow : auto ; 
} 
.left 
{ 
display : table-row; 
background : red ; 
height : 26.66666666666667%; 
width : 100% ; 
overflow : auto; 

} 
.center 
{ 
display : table-row; 
background :blue ; 
height : 26.66666666666667%; 
width : 100% ; 
overflow :auto ; 
} 
.right 
{ 
display : table-row; 
background : gray ; 
height : 26.66666666666667%; 
width : 100% ; 
overflow : auto ; 

} 

} 

Answer 1

要解决大多数CSS跨浏览器问题，请尝试使用CSS重置。你可以从here得到最新的。

我推荐你normalize.css，正如我以前用过的那样，这对解决这类问题非常有用。但测试所有这些，并检查哪一个涵盖您的需求。