Ich habe ein kleines Problem mit CSS. Ich brauche ein trapezförmiges Div, dessen obere linke Ecke (die mit dem Winkel über 90 Grad) abgerundet ist. Das weiß ich schon:

HTML:

<div style="margin:30px">
  <div class="trapezoid">
  </div>
</div>

CSS:

.trapezoid{
  vertical-align: middle;
  border-bottom: 31px solid red;
  border-left: 25px solid transparent;
  height: 0;
  width: 150px;
}

erzeugt ein Trapez. Ich habe es versuchtborder-top-left-radius Eigenschaft, jedoch ist die Wirkung nicht ausreichend genug.

Hier ist eine jsfiddle mit dem obigen Code, mit der man gut herumspielen kann:http://jsfiddle.net/n3TLP/5/

Ich brauche da mehr Infos nur einen Kommentar.
Danke im Voraus :)