Curve the lengths of a rectangle with CSS?

Question

Is it possible to make this shape with CSS? It can't be done with border radius, is there another way to 'bend' a rectangles sides?

Answer 1

As the other answers, the best way to make your shape perfect is using SVG. However with css3 and the help of pseudolements after and before You may have close shapes.

This one is far from good as I've made the FIDDLE as a fast example but with time you may get better results:

div {
  position: relative;
  width: 200px;
  height: 150px;
  margin: 20px 0;
  background: green;
  border-radius: 50% / 10%;
  color: white;
  text-align: center;
  text-indent: .1em;
}
div:before {
  content: '';
  position: absolute;
  top: 10%;
  bottom: 10%;
  right: -5%;
  left: -5%;
  background: inherit;
  border-radius: 5% / 50%;
}
div:after {
  content: '';
  position: absolute;
  bottom: 0px;
  right: -11px;
    width: 130px;
  height: 120px;
  background: green;
  border-radius: 20% / 150%;        
}