CSS prostokątny z jedną owalną stroną

Question

Czy można to zrobić za pomocą CSS? (Kolor nie ma znaczenia, tylko spód, że jest owalny)

Answer 1

Spróbuj

background-color: #60a0d0; 
border-bottom-left-radius:50% 10%; 
border-bottom-right-radius:50% 10%; 

(z odpowiednich prefiksów przeglądarek)

Answer 2

można uzyskać dowolną krzywą z elipsy lub okręgu , umieszczony za głównym blokiem: http://jsfiddle.net/e9RLQ/1/

.box { 
    position: relative;  
    background: #60a0d0; 
} 
.box:after { 
    position: absolute; 
    z-index: -1; 
    left: 0; 
    top: 100%; 
    width: 300%; 
    height: 300px; 
    margin: -292px 0 0 -100%; 
    background: #60a0d0; 
    border-radius: 50%; 
    content: ""; 
} 

Wadą jest złożoność dodawania tła gradientowego.