Question

Доброе время суток.

Задали для пда-версии сайта сследующие стили в css:

.button_oval { border-top: 1px solid #96d1f8; background: #0078a5; background: -webkit-gradient(linear, left top, left bottom, from(#00adee), to(#0078a5)); background: -moz-linear-gradient(top, #00adee, #0078a5); background: -ms-linear-gradient(top, #00adee, #0078a5); background: -o-linear-gradient(top, #00adee, #0078a5); padding: 5px 10px; -webkit-border-radius: 18px; -moz-border-radius: 18px; border-radius: 18px; -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.2); -moz-box-shadow: 0 1px 2px rgba(0,0,0,.2); box-shadow: 0 1px 2px rgba(0,0,0,.2); text-shadow: rgba(0,0,0,.4) 0 1px 0; color: #d9eef7; font-size: 14px; font-family: Helvetica, Arial, Sans-Serif; text-decoration: none; vertical-align: middle; }
.button_oval: hover { color: #dbdbdb; background: #00678e; background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e)); background: -moz-linear-gradient(top, #0095cc, #00678e); background: -ms-linear-gradient(top, #0095cc, #00678e); background: -o-linear-gradient(top, #0095cc, #00678e); }
.button_oval: active { border-top-color: #00adee; background: #00adee; }

Однако вместо кнопки отображается обычная ссылка

Вероятнее всего, подтягивает стиль из родительского элемента.

Подскажите, пожалуйста, как все-таки добиться корректного отображения нужной нам кнопки?

Answer 1

Отредактируйте ссылку :

<a rel="nofollow" href="https://ad.admitad.com/g/yn25dqs7pn823211d02c77b06a97c4/?subid=kumar_mob_news_button" class="button" target="_bkank">Нужны деньги? Возьми кредит!</a>

красное замените на:

class="button_oval"

И поправьте ваши стили:

.button_oval:hover { color: #dbdbdb; background: #00678e; background: -webkit-gradient(linear, left top, left bottom, from(#0095cc), to(#00678e)); background: -moz-linear-gradient(top, #0095cc, #00678e); background: -ms-linear-gradient(top, #0095cc, #00678e); background: -o-linear-gradient(top, #0095cc, #00678e); }
.button_oval:active { border-top-color: #00adee; background: #00adee; }

между двоеточием и ховер и активе не должно быть пробелов так как стиль срабатывать не будет.

Comments

Yuri_Geruk,

Снова появились отступ слева и точки в меню

---

Андрей777,

Чтобы в меню не было точек, в стили допишите:

[id^=uNMenuDiv] ul li { list-style: none!important; }

---

Yuri_Geruk,

А как избавиться от отступа слева, который появился в меню на главной странице после добавления .material-message ul,.material-message li,.content ul,.content li { list-style: inherit!important; margin-left: 20px!important; } ?

---

Андрей777,

Стили:

[id^=uNMenuDiv] ul li {list-style: none!important;}

поправить на подобные:

[id^=uNMenuDiv] ul li {list-style: none!important;margin-left: -5px!important;}

с дальнейшими правками обращайтесь на https://divly.ru/

---

Yuri_Geruk,

Понятно. Спасибо за помощь!