Question

我有所有tr和td的边框表在td里面我把

<input type="radio" />

我给出了输入显示块。

我的问题只在于IE7。

在td上没有边框呈现的表格，当我尝试从输入中移除显示块时，边框出现。

那么我应该使用什么CSS来处理这个问题呢？

这是表格：

<table cellspacing="0" cellpadding="0" class="grid rounded small">
<tr class="grid-headers"><th></th><th>Symmetric</th><th>Imparied</th></tr>
<tr class="grid-row">
    <td><span>Biceps</span></td>
    <td class="radio ">
        <input type="radio" id="question-34838" value="21380" name="helpfulness_34838[]" class="styled">
    </td>
    <td class="radio ">
        <input type="radio" id="question-34838_21382" value="21382" name="helpfulness_34838[]" class="styled">
    </td>
</tr>
</table>

风格：

#content table.grid {
width: 100%;
border: 2px solid #7DB9E8;
float: left;
clear: left;
margin-top: 5px;
overflow: hidden;
}

#content .grid .grid-row {
    height: 30px;
    background: #eee;
    background: -moz-linear-gradient(top,  #ffffff 0%, #dddddd 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#dddddd));
    background: -webkit-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
    background: -o-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
    background: -ms-linear-gradient(top,  #ffffff 0%,#dddddd 100%);
    background: linear-gradient(top,  #ffffff 0%,#dddddd 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#dddddd',GradientType=0 );
}

#content .grid .grid-row td {
    padding: 0px;
    margin-top: 0px;
    border-bottom: 1px solid #ccc;
}

#content .grid .grid-row:hover {
    background: #fff;
}

#content .grid .grid-row:hover td {
    background: #f9f9f9;
}

#content .grid .grid-row td:first-child {
    padding-left: 5px;
}

#content .grid-headers {
    height: 30px;
    background: #7DB9E8;
    color: #fff;
    font-weight: bold;
    text-align: center;
}

#content .grid-headers:hover {
    background: #7DB9E8;
}

#content .grid td.radio {
    height: 30px;
    background: transparent;
    border-left: 1px solid #ccc;
}

#content .grid td.radio:hover {
    background: #fff  url('checks_hover.png') 50% 0px no-repeat;
    cursor: pointer;
}

#content .grid td.radio.selected {
    background: #f9df18 url('checks_clicked.png') 50% 0px no-repeat;
}
#content .grid td.radio.selected:hover {
    background: #fceb55 url('checks_hover.png') 50% 0px no-repeat;
}

#content .grid td.checkbox {
    height: 30px;
    background: transparent;
    border-left: 1px solid #ccc;
}

#content .grid td.checkbox:hover {
    background: #fff  url('checks_hover.png') 50% 0px no-repeat;
    cursor: pointer;
}

#content .grid td.checkbox.selected {
    background: #f9df18 url('checks_clicked.png') 50% 0px no-repeat;
}
#content .grid td.checkbox.selected:hover {
    background: #fceb55 url('checks_hover.png') 50% 0px no-repeat;
}

实际上是JS原型生成的所有HTML

在IE7上没有显示td上的表格边框

0 个答案: