4

そのため、現在、Safari (バージョン 6.0.2) の要素にカーソルを合わせると、その要素の境界線の色が少し奇妙に見えるという問題に直面しています。私が行ったことの内訳を示すために、要素は、左側を除くすべての辺に同じ境界線の色を持つ単純なリスト要素です。

例を次に示します: http://cl.ly/MPkG

ホバーすると、単純な CSS3 スケール トランジションを要素に追加し、境界線の色をより暗い灰色の色合いに変更します (左側を除く)。

これは、問題を示すための実際の大まかなフィドルです: http://jsfiddle.net/dannykeane/N4jF5/

これは、Safari (バージョン 6.0.2) を除くすべての最新のブラウザーで問題なく動作します。この要素に a も追加しようとしましたbackface-visibility:hidden;が、それでも同じように動作します。

どんな助けでも大歓迎です。

ありがとう

4

1 に答える 1

1

これはSafariの未知のバグである可能性がありますが、ボックスの残りの側面よりも左側に太い境界線を配置しようとしているため、バグは非常に理にかなっています。出血はborder-radius定義された状態で表示されます。すべての辺の厚さが等しい場合、境界線の半径があっても、境界線がオーバーフローすることはありません。

また、左側の境界線の太さを調整すると、ページをズームイン/ズームアウトしない限り、にじみが表示されないことに気付く場合があります。これは不安定で一時的な解決策になるため、値を調整しても役に立たない可能性があります。

ブラウザ固有のバグでは何もできませんでしたが、回避策があります。太い境界線を、コンテンツを囲む次のdivに分離することができます。そして、親divに残っている1pxの境界線を削除することを忘れないでください：

border-left: 0;

この基本的なフィドルのように：http：//jsfiddle.net/bgYhQ/

于 2013-01-31T12:41:30.340 に答える