Question

以下是我的代码中的标记。它在除IE8之外的所有浏览器中都可以正常工作。

<label>this is a label</label>
<input type="text" class="formTxt" />
<div class="fl">
    <select><option>opt 1</option><option>opt 2</option></select>
</div>
<div class="validationMsg">there has been an error!</div>

在IE8中查看时，验证消息放在两个输入之间。所以我最终按照以下顺序堆叠在一起;输入，验证消息，然后选择菜单。代码在DOM中呈现如下：

<label>this is a label</label>
<input type="text" class="" />
<div class="validationMsg">there has been an error!</div>
<div class="fl">
    <select><option>opt 1</option><option>opt 2</option></select>
</div>

CSS：

 label {
  float: left;
  clear: both;
  padding: 4px 0;
  width: 100%;
 }

 .formTxt {
  background: none repeat scroll 0 0 #FFF;
  border: 1px solid #AAA;
  border-radius: 3px;
  float: left;
  clear: both;
  outline: medium none;
  padding: 4px;
 }

 input {
  height: 15px;
  line-height: 15px;
 }

 .inputSmall {
  width: 110px;
 }

 .fl {
  float: left;
 }

 .validationMsg{
  clear: both;
  float: left;
  display: block;
  width: 100%;
  font-size: 0.8em;
  padding: 0.3em 0 0;
  line-height: 1.3em;
 }

任何人都可以帮忙解决这个问题吗？

由于

Internet Explorer 8呈现HTML标记与其他浏览器不同

0 个答案: