如何解决跨境高度和边距问题 [英] How to solve cross border height and margin issue

问题描述

如何通过以下简单的CSS在跨浏览器中解决高度和边距问题.在Internet Explorer和Firefox中，按照屏幕大小指定div元素的高度要大一些，然后再指定其他div元素的页眉或其他元素的页脚之间的边距是不均匀的. **或任何我理解问题并找到解决方案的网站参考表**.在此先感谢

我尝试过的事情:

how i can solve the height and margin issue in cross- browser in following simple css. in internet explorer and Firefox the height of div elements are greater then specified as per screen size also margin between header to other div elements or footer to other element is uneven . **or any website reference form where i understand issue and find solution ** . thanks in advance

What I have tried:

@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 ; 

}

}

推荐答案

这是一项快速测试，以了解我们是否已整理出问题

This is a quick test to see if we''ve sorted out a problem

这篇关于如何解决跨境高度和边距问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！