Подтвердить что ты не робот

CSS прямоугольник с одной овальной стороной

Можно ли это сделать с помощью CSS? (Цвет не важен, только нижняя сторона овала)

Ответ 1

Попробуйте

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

(с соответствующими префиксами браузера)

Ответ 2

Вы можете получить любую кривую с эллипсом или кругом, расположенным за основным блоком: 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: "";
}

Недостатком здесь является сложность добавления фона градиента.