[英]In Chrome td border-bottom overlap
In chrome and safari td border overlap over other. 在chrome和safari中,td边框彼此重叠。 I'm using css
我正在使用CSS
.basketTable tr td {
background-color: #FFFFFF;
border-top: 1px dotted #666666;
color: #333333;
padding: 18px 9px 5px 0;
text-align: left;
vertical-align: top;
}
Totally clueless. 完全无知。 I'm sure someone must have faced the same issue, please suggest.
我确定有人一定也遇到过同样的问题,请提出建议。
CSS: CSS:
.basketTable{ border-collapse:collapse;}
.basketTable th {
padding:5px 10px 5px 0;
border-top:4px solid #666;
}
.basketTable tr td {
background-color: #fff;
border-top: 1px dotted #666;
padding:18px 9px 5px 0;
text-align:left;
color:#333;
vertical-align:top;
}
HTML: HTML:
<table width="500px" border="0" class="basketTable" summary="table">
<thead>
<tr>
<th class="productCol">Produkt</th>
<th class="articleCol">Art.nr.</th>
<th class="quantityCol">Antal</th>
<th class="unitPrice">Pris per styck</th>
<th class="totalPrice">Totalt</th>
</tr>
</thead>
<tbody>
<tr>
<td><a href="/alarms/baby_monitors/Pr362455"><img title="product" src="/medias/sys_master/8796144205854/36-2455_t.jpg" alt=""></a><p>Babytalker 1010 PMR Baby Monitor-Small</p></td>
<td class="productCode">36-2455</td>
<td><span class="quantity">1</span></td>
<td><span class="price">5,84<span>(6,49)</span></span></td>
<td colspan="4" class="last-child">5,84</td>
</tr>
<tr>
<td><a href="/alarms/baby_monitors/Pr362455"><img title="product" src="/medias/sys_master/8796144205854/36-2455_t.jpg" alt=""></a><p>Babytalker 1010 PMR Baby Monitor-Small</p></td>
<td class="productCode">36-2455</td>
<td><span class="quantity">1</span></td>
<td><span class="price">5,84<span>(6,49)</span></span></td>
<td colspan="4" class="last-child">5,84</td>
</tr>
</tbody>
</table>
试试table{border-collapse:separate;}
。
尝试td{overflow:hidden;}
,它将边界外的重叠部分移除。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.