やあ!画像でわかるように、角が丸いSafari 6には奇妙な動作があります
{ border-radius: 5px 5px 5px 5px; }
要素の上にマウスを移動すると、何度もホバリングすると細い線ができます... 最初と 2 番目のリンクは上に移動しませんでした。要素の上にマウスを数回移動すると、異なる線が表示されます。 ..
それはただのサファリのバグですか?
私はこれまでこの正確な動作を見たことがありませんが、同様の動作を見たことがあります。あなたはRetinaMBPを使用していると思いますか?そして確かにマウンテンライオンに。Safariで、境界線の半径と仮想解像度(Retinaディスプレイの動作方法)に問題が発生することがあります。
サファリを終了し、解像度を変更して、もう一度開いてみてください。最初は見た目が良ければ、Appleからの修正を待つ必要があります。
それまでの間、すべての境界線スタイルで非表示にできるようにすることができます。
border-color: transparent;
border-style: none;
border-width: 0;
お役に立てば幸いです。
-マイク
この投稿は、あなたの質問に答えるかもしれません。Safari で CSS の角が丸くなるバグはありますか? .
使用してみてください:
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
それ以外の:
border-radius: 5px 5px 5px 5px;