Internet Explorer[CSS]中总是出现非常不寻常的边距

只有在InternetExplorer中才会出现这种情况：我在字段集下获得了额外的19像素的边距，我似乎不明白为什么，不管我怎么做！你自己试试，看看。为了辅助，我添加了一个网格和一些背景色。该字段集应有1.125em的底边距，在Safari、Firefox等浏览器中也有。在InternetExplorer中它有额外的19个像素？我已经给了字段集一个宽度和高度，所以它有布局，希望这有帮助

body{
color:#171717;
font:1em/1.125em Georgia,serif;
margin:0;
padding:0;
}
/*   */
fieldset{
background:fuchsia;
border:0 solid green;
border-width:0.0625em 0;
height:19.125em;
margin:0 0 1.125em;
padding:3.3125em 1.125em 1.0625em;
position:relative;
width:31.5em;
}
/*   */
form dl{
margin:0;
}
form dl dd{
/*       */
height:2.25em;
margin:0 0 1.125em;
position:relative;
/*       */
}
form dl dt{
margin:0 0 1.125em;
}
/*   */
form dl dt+dd+dt+dd{
height:7.875em;
} 
/*   */
form dl+div{
line-height:2.25em;
/*       */
margin:0;
padding:0;
/*       */
}
h3{
color:#701;
font:bold 1em/1.125em Helvetica,Arial,serif;
margin:0 0 1.125em;
text-transform:uppercase;
}
input[type=text]{
border:0.0625em solid #171717;
font:1em/1.125em Georgia,serif;
height:1.125em;
margin:0;
padding:0.5em 1.0625em;
/*       */
position:absolute;
top:0;
/*       */
}
/*   */
legend{
background:aqua;
margin:1.0625em 0 1.125em;
padding:0;
position:absolute;
top:0;
}
/*   */
p{
background:lime;
margin:0 0 1.125em;
}
textarea{
border:0.0625em solid #171717;
font:1em/1.125em Georgia,serif;
height:6.75em;
margin:0;
padding:0.5em 1.0625em;
/*       */
position:absolute;
top:0;
/*       */
}
.Address{
margin:0 0 1.125em;
}
.Address dd{
margin:0;
}
.Address dt{
display:none;
}
.Address dt+dd+dt+dd{
display:inline;
}
.Address dt+dd+dt+dd+dt+dd+dt+dd{
display:block;
text-transform:uppercase;
}
.Bad{
background:#dbb;
color:#901;
}
.Calendar{
list-style:none;
margin:0;
padding:0;
}
.Calendar dd{
background:#701;
font:bold 0.5625em/2em Helvetica,Arial,serif;
margin:0;
text-align:center;
text-transform:uppercase;
}
.Calendar dl{
border:0 solid #111;
border-width:0.0625em 0.125em 0.125em 0.0625em;
float:left;
margin:-0.0625em 1em 1em 1.0625em;
width:3.375em;
}
.Calendar dt{
display:none;
}
.Calendar dt+dd+dt+dd{
background:#fff;
color:#171717;
font:1em/2.25em Georgia,serif;
margin:0;
}
.Calendar h4{
float:right;
font:1em/1.125em Georgia,serif;
margin:0 0 1.125em;
width:10.125em;
}
.Calendar li{
clear:both;
}
.Calendar p{
float:right;
font:1em/1.125em Georgia,serif;
width:10.125em;
}
.Good{
background:#bdb;
color:#091;
}
.Left{
float:left;
margin:0 0.5625em 0 1.125em;
}
.Message{
border-style:solid;
border-width:0.0625em;
margin:0 0 1.125em;
padding:1em 1.0625em 0;
}
.Message p{
margin:0 0 1.0625em;
padding:0.0625em 0 0;
}
.Narrow{
width:15.75em;
}
.Narrow input[type=text]{
width:13.5em;
}
.Right{
float:right;
margin:0 1.125em 0 0.5625em;
}
.Wide{
/*       */
background:gray;
/*       */
width:31.5em;
}
.Wide input[type=text]{
width:29.25em;
}
.Wide textarea{
width:29.25em;
}
.Wrapper{
background:url(../i/grid_w18_h18.png);
margin:0 auto;
overflow:hidden;
padding:1.125em 0 0;
position:relative;
width:50.625em;
}
#Blackboard{
background:#171717;
color:#fff;
margin:1.125em 0 0;
min-width:50.625em;
}
#Blackboard a{
background:#111;
color:#fff;
}
#Blackboard h3{
color:#fff;
}
#Blackboard div>p{
font:1.5em/1.5em Georgia,serif;
}
#Footer{
background:#901;
clear:both;
color:#fff;
min-width:50.625em;
}
#Footer h3{
color:#fff;
}
#Google_Copilot ol{
padding:0;
}
#Google_Copilot ol li{
list-style:none;
margin:0 0 1.125em;
padding:0; /* I.E.7 Fix  */
}
#Google_Map{
height:23.625em;
margin:0 0 1.125em;
width:31.5em;
}
#Google_Query dt{
/*     display:none; */
}
#Header{
background:#901;
min-width:50.625em;
}
#Header h1{
background:url(../i/the_shropshire_arms_w288_h72.gif) no-repeat 0 2.8125em;
font:1em/1.125em serif;
height:7.875em;
margin:0 0 0 0.5625em;
width:18em;
}
#Header h1 a{
display:none;
}
#Header h2{
background-color:#933;
display:inline;
font:1em/2.25em Georgia,serif;
left:0;
margin:1.125em 0 0 0.5625em;
padding:0 0.5625em;
position:absolute;
top:0;
}
#Header h2 a{
color:#fff;
text-decoration:none;
}
#Header h2 a span{
text-decoration:underline;
}
#Header ul{
list-style:none;
height:2.25em;
margin:0;
padding:0;
}
#Header ul li{
display:inline; /* I.E.7 Fix  */
}
#Header ul li a{
background:#fff;
color:#000;
float:left;
line-height:2.25em;
margin:0 0 0 0.5625em;
padding:0 0.5625em;
text-decoration:none;
}
#Header .Wrapper{
background:url(../i/shield_w126_h126.gif) no-repeat 42.1875em 1.6875em;
}

这篇文章可能会很长，因此我将提供一个指向网页的链接，而不是发布HTML：

---

我真的很感谢您的回答和所有贡献者，提前感谢

老实说，很难说到底发生了什么，而且我尝试过的每个浏览器的页面看起来都不一样

不过有几点建议：

1-所有浏览器都有自己的基本页边距等元素，因此最好使用某种重置css，使每个页边距/填充为0，这样当您使用自己的css指定它时，每个浏览器都会为元素解释相同数量的页边距/填充。Eric Meyer制作了一个非常流行的版本：

2-此处设置高度可能是问题的一部分。通常最好让内部元素设置高度，让包含的元素自然流动。在您的情况下，字段集内部的所有内容都应该告诉它应该有多高，而不是字段集有自己的高度

---

只是一些一般性的想法，希望能有所帮助。

我试过不带高度，但不起作用，试过带高度，所以它有布局，也就是说，似乎没有效果，如上所述。请更具体地说明您尝试过的浏览器和实际看到的浏览器。它在Safari、Mac上的Mozilla、即7和Chrome上的渲染效果与预期一致。谢谢这暗示了答案，是表单字段附加了额外的空白。准确地说，默认情况下，Internet Explorer中有额外的1像素边距。然而，尽管上述情况有所帮助，但它并没有提供完美的答案。浏览器测试是为了我们可以设置单独的样式，所以不需要通用的重置表。该网站呈现良好，因为我已经纠正了代码。额外的重置表是不必要的。此外，提供的页面日期为2007年。自那以后，有多少浏览器蓬勃发展，并且所有浏览器都以不同的方式区分各自的显示。