0

我正在编写一个包含表格的网页，当使用 IE8 以外的任何浏览器查看时，每个单元格都有一个白色边框；但在 IE8 中查看时，边框隐藏在行的背景颜色后面。

（即使是 IE9 显示白色边框也没有问题，而且我没有早期的 IE 版本可以尝试。）

知道为什么吗？


HTML如下：

<html>
    <head></head>
    <form>
    <body>
        <div id="selectFullTextTableDiv">
        <table>
          <tr id="oddRow">
            <td id="cellCheckBox"><input name="pid[]" type="checkbox" value="itemOne"></td>
            <td id="itemName">item 1</td>
          </tr>
          <tr id="evenRow">
            <td id="cellCheckBox"><input name="pid[]" type="checkbox" value="itemTwo"></td>
            <td id="itemName">item 2</td>   
          </tr>
        </table>
        </div>
    </body>
    </form>
</html>


CSS如下：

#selectFullTextTableDiv {   position:relative;
    top:0px;
    left:0px;
    }

#selectFullTextTable {  width: 650px;
    float:left;
    position:relative;
    top:0px;
    left:0px;
    margin: 30px 0 0 10px;
    font-family:Arial, Helvetica, sans-serif;
    font-size:14px;
    border-spacing:0px;
    border-collapse:separate;
    }

#selectFullTextTable tr {   position:relative;
       top:0px;
       left:0px;
       }


#selectFullTextTable td {   position:relative;
    top:0px;
    left:0px;
    height:auto;
    vertical-align:middle;
    padding: 10px 5px 10px 5px;
    border-bottom: 2px #FFFFFF solid;
    border-top: 2px #FFFFFF solid;
    }

#oddRow {   background-color:#CCCCCC;
         }

#evenRow {  background-color:#FFCC33;
          }

#cellCheckBox { text-align:center;
    position:relative;
    top:0px;
    left:0px;
    -webkit-border-radius:6px 0px 0px 6px;
    -moz-border-radius:6px 0px 0px 6px;
    border-radius: 6px 0px 0px 6px;
    behavior: url(/CSS3PIE/PIE.htc);
    }

#itemName { margin:2px;
    position:relative;
    top:0px;
    left:0px;
    text-align:left; 
    display:table-cell;
    -webkit-border-radius:0px 6px 6px 0px;
    -moz-border-radius:0px 6px 6px 0px;
    border-radius: 0px 6px 6px 0px;
    behavior: url(/CSS3PIE/PIE.htc);
    }




有没有人看到问题可能出在哪里？如果您能告诉我我在哪里犯了错误，将不胜感激。

谢谢！

4

1 回答 1

0

我正在检查你的代码。首先映入我眼帘的是你body用form. 它应该是相反的方式。

改变这个：

<html>
    <head></head>
    <form>
    <body>
    ..
    </body>
    </form>
</html>

对此：

<html>
    <head></head>
    <body>
         <form>
         ..
         </form>
    </body>
</html>

其次：关闭你的input标签。

改变这个：

<input name="pid[]" type="checkbox" value="itemOne">
<input name="pid[]" type="checkbox" value="itemTwo">

对此：

<input name="pid[]" type="checkbox" value="itemOne" />
<input name="pid[]" type="checkbox" value="itemTwo" />

第三： ID应该是唯一的。您有多个带有 ID 的元素。(cellCheckBox, itemName) 我建议您将它们更改为类，并相应地更改您的 CSS。

检查并报告。如果问题仍然存在，我将进一步调查。

于 2013-09-12T11:47:31.563 回答