Html IE 8.0和Chrome表单格式问题

我已经为表单编写了以下CSS代码

.formcontainer{
    border-radius: 10px;  
    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    box-shadow: 0 0 4px #ccc; 
    -webkit-box-shadow: 0 0 4px #ccc; 
    -moz-box-shadow: 0 0 4px #ccc;  
    border:1px solid #ccc;
    padding:15px;
    width: 740px; 
    margin:0 auto;
 }
form {
    margin:0 auto; 
    text-align:left;
    width:100%;
    background:#fff;    
    behavior: url(./border-radius.htc);
    font-family:Calibri;
    height: auto;
}
fieldset.border{
    overflow:hidden;
    border:1;
    -moz-border-radius:5px;  
    border-radius: 5px;  
    -webkit-border-radius: 5px;
    margin:3px 0;
}
fieldset.no_border{
    overflow:hidden;
    border:0;

    margin:3px 0;
}
fieldset.no_border_submit{
    overflow:hidden;
    border:0;
    text-align:center;
    margin:3px 0;
}
input.effect {
    float:left;
    border:1px solid #ccc;  
    height: 20px;
    padding:3px;
    width:97%;
    font-size:14px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;

}


.cssSubmitButton {          
    font-size: 12px;
    background: #fff no-repeat 4px 5px;
    display: inline-block;
    padding: 5px 20px 6px;
    color: #333;
    border:1px solid #ccc;
    text-decoration: none;
    font-weight: bold;
    line-height: 1.9em;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -moz-box-shadow: 0 1px 3px #999;
    -webkit-box-shadow: 0 1px 3px #999;
    position: relative;
    cursor: pointer;
    outline:none;
}

.cssSubmitButton:visited {}

.cssSubmitButton:hover {
    border:1px solid #333;
}

#personal_details span{
    margin-left: 50px;
    color: #b1b1b1;
    font-size: 11px;
    font-style: italic;
}

.ui-datepicker{
    font-size:12px;
}

#guardian_one_details{
    display:none;
}

#guardian_two_details{
    display:none;
}

#guardian_three_details{
    display:none;
}
#nominee_one_details{
    display:none;
}
#nominee_two_details{
    display:none;
}
#nominee_three_details{
    display:none;
}
#nominee_percentage{
    display:block;
}
#total_nominees{
    display:none;
}
#first_nominee_percent{
    display:none;
}
#second_nominee_percent{
    display:none;
}
#third_nominee_percent{
    display:none;
}

#nominee_percent_allocation{
    display:none;
}

.float_left {
    float:left;
    width:33%;

}

.float_left_nominee_percent {
    float:left;
    width:25%;  
}

.float_left_guardian {
    float:left;
    width:69%;  
}

.float_right_guardian {
    float:left;
    width:29%;  
}

问题是表单在Chrome中正确呈现，但在IE 8中，字段之间的距离太近

如何在IE和Chrome中完成渲染，就像在Chrome中一样

IE中的表单

镀铬

我希望在IE中正确地设置间距，就像在Chrome中一样

我的html代码（部分）

我不想提名。
我想提名。
提名人总数：
单一提名人
两名候选人
三名候选人
提名人一详情：
名称：

地址：

出生日期：

年龄（以年计）：

关系：

监护人姓名：

潘卫报：

在css中使用以下样式

fieldset.no_border{
    overflow:hidden;
    border:0;
    padding:0;
    margin:0 0 10px 0;
}
.float_left_guardian{
    overflow:hidden;
    margin-bottom:10px; 
}

---

希望这能解决您的问题。

您是否包含了重置css，因为这两个版本的boxmodel存在一些差异browsers@Bernhard用整个css更新了问题

fieldset.no_border{
    overflow:hidden;
    border:0;
    padding:0;
    margin:0 0 10px 0;
}
.float_left_guardian{
    overflow:hidden;
    margin-bottom:10px; 
}