iOSでCSSでborder-radius と overflow:hiddenを指定した、角丸マスクが効かなくてハマった話 作っていたサイトで、ちょっと写真をカッコよく表示したいなと思いborder-radiusとoverflow:hiddenを利用した角丸マスクで表示するようなものを作りました。その時iOSで少しハマったので、その対処法などをご紹介します。 実際に作ったのが以下のようなものです。 See the Pen border radius & overflow hidden by monochrome (@monochrome-design) on CodePen. それなりに上手く出来たと思っていたのですが、スマホで見てみると丸くマスクされていない事が判明。。。 あれ?と思いmacのsafariで見てみると同じくマスクされていませんでした。しかし、chromeやfirefoxで
![iOSでCSSでborder-radius と overflow:hiddenを指定した、角丸マスクが効かなくてハマった話 | MONOCHROME DESIGN|東京杉並のフリーランスWEBデザイナー。WordPressホームページ/ウェブサイト制作](https://cdn-ak-scissors.b.st-hatena.com/image/square/f353ede275e79aeed2de5fa65686b059451d0737/height=288;version=1;width=512/https%3A%2F%2Fmonochrome-design.jp%2Fwp-content%2Fuploads%2F2018%2F02%2F806_00.jpg)