border-radiusとoverflow:hiddenをしたときの各ブラウザの挙動の違い - Toro_Unit最新のブラウザだとベンダープレフィックス無しでborder-radiusが使えるようになりました。 そんなわけで仕事で使おうと思いましたが、ちょっとしたトラブルが。 border-radiusを掛けた要素にoverflow:hiddenを掛けたときの挙動が各ブラウザでちょっと違います。 そんなわけでそのまとめです。 とりあえずデモを用意したのでこれを見ながら解説です。 [css] .box1 { border-radius: 30px; border: 5px solid #999; overflow: hidden; } [/css] これでIE9,firefoxは問題なく内側の要素も丸く切り取られて表示されます。 しかし、chrome等のWebkit系、Operaではう内側の要素がborderに重なって表示されてしまいます。 Operaだと解決方を発見できなかったので、Operaもター
