border-radiusを使用した場合は内側の要素にも付けなければいけないことがある #CSS

by iwbjp

HTML

<div class="box">
  <div class="title">title</div>
    <div class="desc">
    テキストが入ります。<br>
    テキストが入ります。<br>
    テキストが入ります。<br>
    テキストが入ります。
    </div>
</div>

CSS

.box {
  display: block;
  width: 200px;
  border: 1px solid #CCC;
  border-radius: 5px;
  text-align: center;
}

.title,
.desc {
  padding: 5px 0;
}

.title {
  /*border-radius: 5px 5px 0 0;*/
  background: #EEE;
}