@galsik

Обратная связь html+css?

Есть такой код, все работает прекрасно. Обратная связь выезжает слева, что поменять в css чтоб выезжала с права.
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Обратная связь</title>
  <style>
   body {
    margin: 0;
   }
   .feedback {
    border-radius: 0 10px 10px 0;
    width: 300px;
    background: #333; /* Цвет фона */
    color: #fff; /* Цвет текста */
    position: fixed; /* Фиксируем на одном месте  */
    min-height: 100px; /* Минимальная высота */
    top: 100px; left: -320px;
    border-right: 20px solid #fc0; /* Оранжевая граница справа */
    padding: 10px;
    transition: left 1s; /* Анимация */
   }
   .feedback img {
    float: left;
    margin: 0 10px 0 0;
   }
   .feedback::after {
    content: 'Обратная связь'; /* Выводим текст */
    color: #000; /* Цвет надписи */
    position: absolute; /* Абсолютное позиционирование */
    right: -60px; bottom: 50px;
    transform: rotate(-90deg); /* Поворачиваем текст */
    -webkit-transform: rotate(-90deg);
   }
   .feedback:hover {
    left: 0; /* При наведении сдвигаем вправо */
   }
  </style>
 </head>
 <body>
  <div class="feedback">
   <img src="images/feedback.jpg" alt="" width="100" height="100">
   Если у вас возникли вопросы по этому коду, звоните мне по телефону:
   555-3298. Звонок платный.
  </div>
 </body>
</html>


Сам поменял кое что на с left на right перенеслась вправо но все работает не так.
.feedback {
...
    right: -320px;
...
   }
  
   .feedback:hover {
    right: 0; 
   }
  • Вопрос задан
  • 368 просмотров
Решения вопроса 1
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
23 нояб. 2024, в 01:31
1000 руб./за проект
23 нояб. 2024, в 00:16
2000 руб./за проект
22 нояб. 2024, в 23:55
3000 руб./за проект