要するに、タッチスクリーンデバイスでスケーリングしているときに奇妙な白い線が表示されるWebサイトがあります。ウェブサイトは主にデザインに表を使用しています。これらの問題はすべてtd要素で発生し、側面はかなりランダムです (下、上、左、右)。この質問は、数年前に投稿された問題とよく似ています: Web ページ上の薄い灰色の黒い線ですが、ここでの違いは隣接するdivがありません。複数の背景の代わりに背景色と角丸を使用してそのうちの 1 つを解決できますが、Web サイトの背景は CSS グラデーションでは実行できないため、どこでも使用することはできません。
だから私が確認したこと:
- 背景画像をカラーに変更することで問題を解決できます。
- 隣人がいない場所で発生することがあります。
- 拡大すればするほど、縞模様が長くなったり見えたりします。
- 問題のあるこれらすべての td-s には背景画像がありますが、画像付きのすべての td 要素に奇妙な白い線があるわけではありません。
ウェブサイトの最小化されたページで問題を再現できないため、jsfiddle を投稿できませんが、小さな html (td タグ間の問題の発生) を投稿できます。
<table id="messages" class="default dark">
<tbody>
<tr>
<td class="left_top">works</td>
<td class="mid_top">top line</td>
<td class="right_top">works</td>
</tr>
<tr>
<td class="left">line on left</td>
<td class="problematic">bottom line</td>
<td class="right">line on left</td>
</tr>
<tr>
<td class="left_bottom">works</td>
<td class="mid_bottom">works</td>
<td class="right_bottom">works</td>
</tr>
</tbody>
</table>