Html DIV CSS在较低IE版本中未正确对齐

我有一个JSP代码，在div标记及其相关联的CSS中有标签和输入字段。 在IE9+中，这些字段的对齐情况看起来不错，但在IE7中则不一样

左上角略高，右下角相当低。我们也必须支持较低的IE版本

JSP代码：-

<form:form...>
<DIV class="outer-left-bm">Location:&nbsp;</DIV><DIV class="outer-right-bm"><form:select path="location" items="${locationList}" itemValue="code" itemLabel="desc" /></DIV>
<DIV class="outer-left-bm">Name:&nbsp;</DIV><DIV class="outer-right-bm"><form:input path="Name" maxlength="20" size="20" /></DIV>
</form:form>

感谢您的帮助

更新：-

<form:form>
<DIV style="font-size: 0;">
<DIV class="outer-left-bm">Location:&nbsp;</DIV><DIV class="outer-right-bm"><form:select path="location" items="${locationList}" itemValue="code" itemLabel="desc" /></DIV>
    <DIV class="outer-left-bm">Name:&nbsp;</DIV><DIV class="outer-right-bm"><form:input path="Name" maxlength="20" size="20" /></DIV>

更新2：

DIV.outer-left-bm {
    width:49%;  
    min-height: 0;
    border: 1px;
    text-align: right;
    margin-bottom: 8px;
    display: inline-block;
    *display: inline;
    zoom: 1;
}
DIV.outer-right-bm {
    width: 50%; 
    min-height: 0;
    border: 1px;
    text-align: left;
    margin-bottom: 8px;
    display: inline-block;
    *display: inline;
    zoom: 1;
}

---

您可能希望为Internet Explorer 6和更低版本使用单独的样式，下面是使用条件样式表的代码，将其放置在其他链接样式表的下面，以便此IE6和更低版本样式表覆盖您已经应用的css

<!--[if lt IE 7]>
  <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

---

您可能希望为Internet Explorer 6和更低版本使用单独的样式，以下是使用条件样式表的代码，将其放置在其他链接样式表的下方，以便此IE6和更低版本样式表覆盖您已经应用的css

<!--[if lt IE 7]>
  <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

---

A

清除：
上的两个
css属性。左外bm
应足以使div正确对齐

例如，请参见下面的链接。在两个div上添加了背景色，因此我们可以看到它们堆叠的位置以及边界的位置

A
清除：
上的两个
css属性。左外bm
应足以使div正确对齐

例如，请参见下面的链接。在两个div上添加了背景色，因此我们可以看到它们堆叠的位置以及边界的位置

考虑使用
显示：内联块
而不是
浮点
。用于删除块之间的空白，为容器设置
font size:0
，为嵌套块设置像素字体大小，如
outer left bm


表单{
字号：0；
}
表格DL，
表格DT，
表格DD{
保证金：0；
填充：0；
}
表格DT，
表格DD{
显示：内联块；
字体大小：13px；
垂直对齐：顶部；
宽度：49%；
}
/*IE7的内联块：*/
*+HTML表格DT，
*+HTML表格DD{
显示：内联；
最小高度：0；
}

地点：
你好
姓名：
考虑使用
显示：内联块
而不是
浮点
。用于删除块之间的空白，为容器设置
font size:0
，为嵌套块设置像素字体大小，如
outer left bm


表单{
字号：0；
}
表格DL，
表格DT，
表格DD{
保证金：0；
填充：0；
}
表格DT，
表格DD{
显示：内联块；
字体大小：13px；
垂直对齐：顶部；
宽度：49%；
}
/*IE7的内联块：*/
*+HTML表格DT，
*+HTML表格DD{
显示：内联；
最小高度：0；
}

地点：
你好
姓名：
它与前两个字段对齐，但没有完全对齐。我的意思是我有10块地。它对齐第一个2，向下移动第三个右div，并将第四个右div完全移动到第五个左div，依此类推。顺便说一句，我必须使用清楚：两者；在左边和右边，使它工作。它在页面上也引入了滚动。它有点对齐前两个字段，但没有完全对齐。我的意思是我有10块地。它对齐第一个2，向下移动第三个右div，并将第四个右div完全移动到第五个左div，依此类推。顺便说一句，我必须使用清楚：两者；在左边和右边，使它工作。它在页面上也引入了滚动。谢谢。我也试过了，但在IE7中，两个字段对齐，在3/4字段之后，它向下移动，并且没有对齐。谢谢。我也试过，但在IE7中，两个字段对齐，在3/4字段之后，它会向下移动并对齐。我知道，但没有选择。我使用了内联块，看起来右div现在移动到下一行。您注意到
width:49%
声明了吗？这一点很重要（旧版IE在一行中拟合多个元素时遇到问题，如果它们的宽度是百分比，即使从数学上讲这些值正好等于总数的100%）。我用更新部分更新了我的问题，并添加了JSP和CSS的代码。用fot:size:0将div包装在另一个div中；css更新为inlie块和字体大小（以像素为单位）。仍然正确的div完全移动到下一行。您是否注意到IE7需要
内联
而不是
内联块
？
*+HTML
是一种众所周知的CSS攻击（如IE6的
*HTML
），它允许在IE7中特别应用样式。（请注意，在IE7兼容模式下，真正的IE7和IE8+可能（并且确实）工作方式不同。）IE5目前根本不重要，不管发生什么，即使是在公司内部网站中。一般来说，考虑使用IE到版本10包含的所谓的条件注释。并确保您的HTML文档具有正确的声明。我知道，但没有选择。我使用了内联块，看起来右div现在移动到下一行。您注意到
width:49%
声明了吗？这一点很重要（旧版IE在一行中拟合多个元素时遇到问题，如果它们的宽度是百分比，即使从数学上讲这些值正好等于总数的100%）。我用更新部分更新了我的问题，并添加了JSP和CSS的代码。用fot:size:0将div包装在另一个div中；css更新为inlie块和字体大小（以像素为单位）。仍然正确的div完全移动到下一行。您是否注意到IE7需要
内联
而不是
内联块
？
*+HTML
是一种众所周知的CSS攻击（如IE6的
*HTML
），它允许在IE7中特别应用样式。（请注意，在IE7兼容模式下，真正的IE7和IE8+可能（并且确实）工作方式不同。）IE5目前根本不重要，不管发生什么，即使是在公司内部网站中。一般来说，考虑使用IE到版本10包含的所谓的条件注释。并确保您的HTML文档具有正确的声明。
<!--[if lt IE 7]>
  <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->