CSSで正円を作成したサンプル

HTML

<div class="circle"></div>
<br>
<div class="circle2"></div>

CSS

.circle {
  width: 50px;
  height: 50px;
   /* 幅と高さの半分 */
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  background: #C00;
}
.circle2 {
  width: 70px;
  height: 70px;
   /* 下記の指定だと幅と高さが変更になった場合、
      正円を維持できない */
  -webkit-border-radius: 25px;
  -moz-border-radius: 25px;
  border-radius: 25px;
  background: #C00;
}