私はborder-radius(そして-moz-border-radius古いブラウザーの場合は) 20px に設定しましたが、Safari と Firefox で美しく動作しています。次に、Chrome を開くと、定義された .xml を受け入れることを拒否していborder-radiusます。Chrome でこれを回避するための提案はありますか?
ここで実際の CSS コーディングを参照してください: http://jsfiddle.net/MAYea/
Safari でのスクリーンショット:
Chrome のスクリーンショット:
機能していないのでborder-radiusはなくoverflow、オーバーフローを隠せていないのです。
これは実際には Chrome の新しいバグです。以前のバージョンの Chrome では完全に機能していましたが、 Doomsday 時計にも同様の問題があります。
border-radius回避策として、コンテナだけでなく、含まれている要素にもを指定できます。
同様の問題がありました。追加するのに役立ちました
z-index: 0; /* or some other value */
だけでなく、
transform: translateY(0);
これは、ある種の異なるレンダリングを有効にしているようです (GPU レンダリングを強制するために時々行うような 3D コンテキストでは何もないと思います...)
これが機能する理由は説明できませんが、他の誰かができるのではないでしょうか?
OS X 10.10.5 の最新の Chrome v44 で、この特定の問題が発生しています...はい、これは「修正済み」であり、古い質問です =)...
編集：別のSO-Questionで同じ修正が見つかりました。ここを確認してください：リンク
と の両方にborder-radius: 20px;CSS ルールを追加します。:before:after
-webkit-border-radius:あなたが探しているのは何だと思いますか？
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
-webkit-border-radius: for the Chrome