エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
border-radiusで子要素がはみ出す時はoverflow:hidden; | CommentOut
記事へのコメント0件
- 注目コメント
- 新着コメント
このエントリーにコメントしてみましょう。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
border-radiusで子要素がはみ出す時はoverflow:hidden; | CommentOut
CSSのborder-radiusを使う時、ボタンや画像の角を丸くすることもあれば、中にいろいろ要素の詰まったカ... CSSのborder-radiusを使う時、ボタンや画像の角を丸くすることもあれば、中にいろいろ要素の詰まったカードの角を丸くしたいことありますよね。 全ての要素が中央部に密集していればいいのですが、ちょっと背景を塗り替えたり、縁にぴったりくっついた見出しをデザインしたい時、親要素にborder-radiusを指定していても、子要素がはみ出してしまうんですよね。 親要素にborder-radiusを付けても子要素がはみ出る以下のサンプルを見てください。 1番目のサンプルは親要素にのみborder-radiusを設定しています。 子要素が普通にはみ出していますね。 これでは理想のスタイルにはなりません。 そこで2番目のサンプルです。 子要素にもborder-radiusを適応する愚直に子要素のはみ出した部分をborder-radiusの中に収めようとすると、見出し部分にもborder-top