Huge border-radius

Huge border-radius

by Csaba Hellinger

HTML

<div class="square percent"></div>
<div class="rect percent"></div>
<br/>
<div class="square hugevalue"></div>
<div class="rect hugevalue"></div>

CSS

div {
  background: navy;
  display: inline-block;
}

.square {
  width: 100px;
  height: 100px;
}

.rect {
  width: 400px;
  height: 100px;
}

.percent {
  border-radius: 50%;
}

.hugevalue {
  border-radius: 100rem;
}