safariでborder-radiusがhover時に効かない!なんでか解除される…

Macでホバー時になぜか丸から四角になるメニューがあるんだけど…といわれて見てみると
本当だ…一部だけなぜかborder-radiusが効いていない!

しかもsafariだけ!!なんで!?

ということで、対応方法があまりにも簡単すぎで頭から抜け落ちそうだったので
備忘録として残しておこうと思います。

border-radiusを指定している要素にz-indexを指定するだけ!
はい、これだけ!

もうあっという間に問題が解決されました。

safariで下記を見てみて下さい。

See the Pen safariの by sayuri (@giraffeweb) on CodePen.light

もし同じ現象になっている人がいれば試してみてくださいね!