我如何通过以下简单的 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 ;
}
}
最佳答案
要解决大多数 CSS 跨浏览器问题,请尝试重置 CSS。您可以从 here 获取最新的.
我向您推荐normalize.css,因为我以前用过它,它非常适合解决此类问题。但是测试所有这些并检查哪一个满足您的需求。
关于html - 如何解决跨境高度和边距问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39888107/