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

by gajyuma

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: 15px;
  text-align: center;
}

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

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