Какие нужны стили css для такого закругления кнопки?

Question

[Ratibor]

Здравствуйте не могу сообразить как реализовать такое закругление у кнопки

Дайте совет.

Comments

[User202999]

Это наверное не кнопка, а картинка. Точнее три картинки разных цветов, одна базовая, другая для onmouseover, третья onclick как-то так

Answer 1

[Wispik]

border-radius

Comments

[Ratibor]

Спасибо большое!

[alexalexes]

Ratibor, если хотите точь-в-точь, то border-radius не хватит.
Нужно либо комбинировать фон кнопки из разных текстур, либо использовать SVG, чтобы нарисовать сложный контур.

Answer 2

[Kubakh]

Я бы svg использовал, штатными средствами не обойтись в данном случае

Comments

[Ratenti]

А border radius?

[ImagineTables]

В данном случае оно того не стоит, ИМХО. Сгодится и растр. Для чего городить SVG (да даже и CSS)? На ultra high dpi заапскейлится немного мыльно? Зато быстро.

2ТС: луркайте диск «1000 золотых стилей для ФШ», гы-гы.

Answer 3

[Holyweed]

это border-radius, а величину ему надо писать в процентах
например border-radius: 25%;
тогда он будет скруглять углы относительно ширины и высоты. при использовании px вместо процентов, угол будет скругляться более равномерно.

Answer 4

[Bitmap_ru]

Попробуй
border-radius: 10% 10% 10% 10% / 50% 50% 50% 50%

Comments

[Иван Мусинский]

Можно сократить
border-radius: 5% / 50% 50% 50% 50%