-
ID:i83whG さんの質問

こんにちは。親要素にcssで角丸を適用していた場合、ブラウザーの表示上で角に接して配置される子要素にも角丸を適用しないと、子要素の角が表示されてしまうのでしょうか?

何か親要素だけに角丸を適用していたら、必要に応じて子要素も角丸が適用、または、親要素の角丸でクロップされるような方法というのは存在するのでしょうか?

<div class="wrapper">
<h1 class="wrapper__heading">タイトル</h1>
<p>コンテンツ</p>
</div>

.wrapper {
border-radius:10px;
}

.wrapper__heading {
background: #000000;
/*上の左右角に角丸を設定しないとダメ? */
}

みんなの回答 3 件

ID:xtBMFm さんの回答

子要素にも設定しないと突き破るよ

ID:AEdpxs

ありがとうございます!

ID:R2Lpr2 さんの回答

子要素に背景を入れなければ親要素の角丸が出てくると思うけど。
背景を入れたいなら、子要素にも角丸設定してあげないと当然突き破るよ。

ID:AEdpxs

ありがとうございます!

ID:/.A3Gh さんの回答

親要素にoverflow:hiddenかければ、中にかけなくてもOKです。
しかしPIEとか使ってるならどうなるかは分かりません。

ID:QgdmP.

ありがとうございます!!hiddenですね!
PIEってなんですか?

ID:QgdmP.

overflow:hiddenでいけました!ありがとうございます^^

ID:/.A3Gh

PIEとはこれのことです
allabout.co.jp/gm/gc/377416/2/

最終更新日:2014-08-25 (8,564 views)

関連するトピックス

ページ上部に戻る