Semi-oval with CSS

Question

I\'m trying to create a mix between an oval and a semi-circle.

Semi-circles can be created as such in CSS:

.halfCircle{
     height:45px;
     width         


        

Answer 1

We can use css3 radial-gradient() as well to draw this shape:

.halfOval {
  background: radial-gradient(ellipse at 50% 100%, #a0C580 70%, transparent 70%);
}

.halfOval {
  background: radial-gradient(ellipse at 50% 100%, #a0C580 70%, transparent 70%);
  margin: 50px auto;
  height: 100px;
  width: 400px;
}