Форум Сайтостроение Веб-строительство

Почему не работает border-radius (см. код)?

12
Mahol
На сайте с 20.11.2016
Offline
92
Mahol
696

Всем доброго вечера. Имеется такая конструкция:

<p style="text-align: center;"><span style="font-size: 26pt;"><a class="class_2" href="ссылка"><span style="font-family: museo300;">Блог</span></a></span></p>

.class_2 {

font-size: 28px !important;

padding:20px 40px 20px 40px;

border: 1px solid transparent;

border-image: linear-gradient(#47C3C3 , #374069);

-moz-border-image: -moz-linear-gradient(#47C3C3 , #374069);

-webkit-border-image: -webkit-linear-gradient(#47C3C3 , #374069);

border-image-slice: 1;

border-radius: 10px 10px 10px 10px;

-moz-border-radius: 10px 10px 10px 10px;

-webkit-border-radius: 10px 10px 10px 10px;

}

Как закруглить края? Border-radius не работает.

jpg 56.jpg
VV
На сайте с 19.12.2009
Offline
125
veni_vidi_vivi
#1

display: block;

может добавить?

vk.cc/7mGAMH
Mahol
На сайте с 20.11.2016
Offline
92
Mahol
#2
veni_vidi_vivi:
display: block; может добавить?

Не заработало.

jpg 181029.jpg
Оптимизайка
На сайте с 11.03.2012
Offline
396
Оптимизайка
#3

https://stackoverflow.com/questions/5706963/possible-to-use-border-radius-together-with-a-border-image-which-has-a-gradient

⭐ BotGuard (https://botguard.net) ⭐ — защита вашего сайта от вредоносных ботов, воровства контента, клонирования, спама и хакерских атак!
Geers
На сайте с 12.04.2011
Offline
487
Geers
#4
Mahol:


border-radius: 10px 10px 10px 10px;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-radius: 10px 10px 10px 10px;

Если все края одинаковы, не надо писать 4 раза одно и то же.

Так достаточно будет: 

border-radius: 10px;

-moz-border-radius: 10px;

-webkit-border-radius: 10px;

Сокращайте коды. ;)

Оптимизайка
На сайте с 11.03.2012
Offline
396
Оптимизайка
#5

Geers, да и браузер-специфичные префиксы уже тут не нужны.

melkozaur
На сайте с 06.04.2010
Offline
505
melkozaur
#6

Geers,

Там и поля можно подсократить

padding:20px 40px;

Серверы в NL/US со скидкой 30% нашим читателям: E5-2650v4/10GB DDR4/240GB SSD/1 Gbps - от $20: https://ua-hosting.company/vps/nl SEO без компромиссов: https://seoleaks.net SEOLEAKS - продвижение сайтов: https://www.instagram.com/seoleaks
Geers
На сайте с 12.04.2011
Offline
487
Geers
#7
melkozaur:
Geers,
Там и поля можно подсократить
padding:20px 40px;

Ага, не обратил внимание) ;)

Mahol
На сайте с 20.11.2016
Offline
92
Mahol
#8

Geers, задачу это не решает :)

Сначала и был короткий код, потом погуглил, нашел генераторы бордер-радиуса, вот этот генератор и выдал такой код (вдруг заработает).

melkozaur
На сайте с 06.04.2010
Offline
505
melkozaur
#9
Оптимизайка:
https://stackoverflow.com/questions/5706963/possible-to-use-border-radius-together-with-a-border-image-which-has-a-gradient

Там по ссылке ниже решение есть.

gribbo
На сайте с 01.03.2012
Offline
66
gribbo
#10

надо дружить radius и border-image, выше ссылка на пример реализации

Мой выбор хостинга (https://beget.com/p461662) \ Создаю сайты (/ru/forum/1009089)
12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий