Top.Mail.Ru
Ответы
Аватар пользователя
Изменено
Аватар пользователя
Аватар пользователя
Аватар пользователя
Программирование
+3

Переход кнопки на css при наведении смена цвета.

Есть платформа Чатовод. CSS.
Хочу вместо ссылок сделать живые кнопки.
Форма и цвет добавляются но они не живые.
Пробовал все совет с инета они не оживляются при наведении и нажатии.
Вот код, не пойму что где надо прописать что бы оживить.

.chatSendLinksPanel a.chatLinkSmiles {
box-shadow: 0px 1px 0px 0px #9fb4f2;
background:linear-gradient(to bottom, #7892c2 5%, #476e9e 100%);
background-color:#7892c2;
border-radius:4px;
display:inline-block;
cursor:pointer;
color:#ffffff;
font-family:Arial;
font-size:12px;
font-weight:bold;
padding:0px 10px;
text-decoration:none;
text-shadow:0px 1px 0px #283966;
}
.myButton:hover {
background:linear-gradient(to bottom, #476e9e 5%, #7892c2 100%);
background-color:#476e9e;
}
.myButton:active {
position:relative;
top:1px;
}

Если кто то разбирается могу предоставить чат вплоть до доступа.
Чат почти готов но есть еще три момента которые мне не под силу.

По дате
По рейтингу
Аватар пользователя
Новичок

Активность кнопки здесь посмотри
https://bulletproof-password.web.app/calculator.html

Аватар пользователя
Профи

/* Основной стиль кнопки */
.myButton {
box-shadow: 0px 1px 0px 0px #9fb4f2;
background: linear-gradient(to bottom, #7892c2 5%, #476e9e 100%);
border-radius: 4px;
display: inline-block;
cursor: pointer;
color: #ffffff;
font-family: Arial;
font-size: 12px;
font-weight: bold;
padding: 10px;
text-decoration: none;
text-shadow: 0px 1px 0px #283966;
}

/* Эффект при наведении */
.myButton:hover {
background: linear-gradient(to bottom, #476e9e 5%, #7892c2 100%);
}

/* Эффект при нажатии */
.myButton:active {
position: relative;
top: 1px;
}