html - コーナーでの境界半径ブレーク

Question

ウェブサイト用のコンテンツボックスをデザインしましたが、デスクトップでは見栄えがよくなりました。でも今は携帯に入れたい。 ここで関連する html+ css
のみの例を参照できますhttp://pastehtml.com/view/bze2phhwn.html
1 ～ 3 ピクセルの角が丸くなっており、少しズームインすると、ブラウザでもこの効果を確認できます。少しズームアウトしてズームインすると、この効果が常にあるとは限らないことがわかります。だから私はそれが私の悪いhtml + cssではないと思った。

何が問題なのですか？

Answer 1

これはバグのようです。Mozillaに提出：

https://bugzilla.mozilla.org/show_bug.cgi?id=758958

また：https ：//stackoverflow.com/questions/10774506/border-radius-causes-white-lines-when-applied-to-individual-corners/10774635#10774635

Answer 2

これもバグだと思いますが、修正を見つけました...いや、ハックと見なされるかもしれません。これが私の問題の画像です：

http://i909.photobucket.com/albums/ac298/roboyak/missingBorder_zpsbhftdfmd.png

私の話は、親の Web ページから課された reset.css スタイル シートを取得していたということです。td 要素は、その css シートから次のスタイルを取得していました。

table tbody tr td {
    border-bottom: 1px solid #ccc;
}

ずいぶん前にプロジェクトを開始したとき、シートに次のルールを記述して、このスタイルを無効にしました。

table tbody tr td {
    border-bottom: none;
}

私の問題を解決しようとして、border-bottom ルールが none ではなく「medium none」として表示されていることに気付きました。以下のコードを追加したところ、ボーダーが壊れなくなりました。

 table tbody tr td {
     border-bottom: none none;
 }

基本的に、これはルールに違反するため、すべての td で境界線が再び戻ってきますが、これは私が望んでいるものではありませんが、これにより、何が起こっているのかについての洞察が得られると思います。