Question

我的网站上有一张带有背景图片的表格。 FF和chrome看起来正常但不在IE中。背景图像似乎移动并生成有线结果。我想知道这里是否有人可以帮我解决这个问题。请参阅附件picture。谢谢您的帮助。

<section>
some html....

<form action="http://localhost/jobSearch/add_project/validate" method="post" accept-charset="utf-8">
  <fieldset>
    <legend>ADD NEW PROJECT</legend>
      <label>Parcel</label>
      <input type="text" name="parcel" value="">
      <label>Lot Number</label>
      <input type="text" name="lot_number" value="">
      <label>Block</label>
      <input type="text" name="block" value="">
      <label>Subdivision</label>
      <input type="text" name="subdivision_name" value="">
      <label>Section/Phase</label>
      <input type="text" name="section_phase" value="">
      <input type="submit" name="submit" value="Add Project" id="submit">
  </fieldset>
</form>

more html.....
</section>

CSS：

form {
    display: block;
}

form fieldset {
    font: bold 1.1em helvetica;
}

form label{
    float:left;
    display:block;
    width:140px;
    font:bold 1.1em Helvetica;
    margin:5px;
}

fieldset{
    color:black;
    font:bold 1.2em Helvertica;
    width:400px;
    margin: 20px auto;
    padding: 10px;
    border:1px solid grey;
    background:url('../images/background.jpg');
}

form input {
    font-size: .9em;
    padding: 4px 6px;
    border: solid 1px #AACFE4;
    margin: 5px;
    width: 200px;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

form #submit {
    cursor: pointer;
    font: bold 1em Helvetica;
    padding: 4px 2px;
    border: solid 1px #AACFE4;
    margin: 5px;
    width: 100px;
}

Answer 1

您的代码未正确嵌套。您使用<form>打开，但使用</fieldset>关闭。您需要在下面的示例中交换结束标记的位置以更正嵌套问题。

<form ...>
  <fieldset>
<!-- content removed -->
  </form>
</fieldset>

IE表背景bug

1 个答案: