border-*-radius: 100%

top-left only

.test {
  border-top-left-radius: 100%;
}

まぁ100%。

top-left and top-right

.test {
  border-top-left-radius: 100%;
  border-top-right-radius: 100%;
}

あれ?50%?

top-left and bottom-right

.test {
  border-top-left-radius: 100%;
  border-bottom-right-radius: 100%;
}

まぁ100%。

top-left and bottom-left

.test {
  border-top-left-radius: 100%;
  border-bottom-left-radius: 100%;
}

あれ?50%?

Gotcha!

.test {
  border-top-left-radius: 50% 100%;
  border-top-right-radius: 50% 100%;
}

ちゃんと重ならないようにするとうまく行く。