Jump to content
  • 0

Не работает перекатывание картинки в Хроме и Опере


roland
 Share

Question

Собственно код

.enter {background: url("../img/enter.png");    display: inline-block;    width: 170px;    height: 42px;	position: relative;margin-left: 20px;cursor: pointer;    font-family: Arial, sans-serif;    font-size: 20px;    font-stretch: condensed;    font-style: italic;    font-weight: bold;    color: #7F5B2B;    line-height: 42px;    text-align: center;    text-decoration: none;    text-shadow: 1px 2px 3px rgba(255,255,255,0.5);    -webkit-background-clip: text;       -moz-background-clip: text;          background-clip: text;}.enter:hover {background-position: 0 -42px;}.enter:active {background-position: 0 -84px;}
<button class="enter" onclick="submit();" type="submit">ВОЙТИ</button><a href="{registration-link}"><div class="enter">РЕГИСТРАЦИЯ</div></a>

Проблема в браузерах или в моих кривых руках?

Link to comment
Share on other sites

2 answers to this question

Recommended Posts

  • 0

Все работает, просто у вас фон не видно т.к. текст непрозрачный. Назначьте color: transparent. Кстати, свойство background-clip: text не поддерживается ни одним браузером, кроме хрома и оперы, так что его применение нежелательно.

  • Like 1
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

  • Similar Content

    • By Ospna
      Решил анимировать иконки, нашел пример в интернете, скопировал

      в Safari Версия 11.0.2 (13604.4.7.1.3), в мобильных Safari и Chrome все отображается отлично

      но почему-то иконки неправильно отображаются в Chrome Mac (Версия 63.0.3239.132 (Официальная сборка), (64 бит), Chrmoe Windows и Edge - на переднем плане анимированный градиент, а на заднем иконка
       
      пример кода
      пример того как должна выглядеть анимированная иконка во вложении
      Screen Capture 2018-01-10 06.49.14.mov
    • By Dmitrij
      http://test1.chpmodul.com.ua/
      столкнулся с такой проблемой:
      сначала сверстал сайт, все было нормально, а потом добавил в него медиа запросы @medai (max-width: 540px)
      и на интернет эксплорере верстка совсем сломалась.
      почему это случилось и как исправить?
    • By forest_moss
      всем привет.
      у меня появилась проблема того, что тень текста дико коверкается в сафари и в браузере телефона.
      неужели этого никак не избежать!?
      может, есть какие-нибудь решения, ведь наверно же с этим сталкивались многие другие?


      вот пример, здесь все минимизировано:
      скришот в разных браузерах:

      код:
      <!DOCTYPE html><html><head><meta charset="utf-8"> <title>font</title><style>    body{background: #e5e08b;}    p{    font-family: arial;    color: #ffe;    font-weight:bold;    text-shadow: 0 0 .1ex #ba0, 0 0 .1ex #870, 0 0 .1ex #870,    0 .7ex .1ex #fff,    2ex 0 .5ex #ffd, -2ex 0 .5ex #ffd;    }</style></head><body>        <p>Lorem ipsum</p></body></html>вот даже ссылка, если кому интересно.

      Есть идеи, как правильно обращаться с этой тенью???
      или хотя бы как исправить ситуацию в данном случае...
    • By Feel
      Доброго времени суток.
       
      Задался проблемой соблюдения правил для верстки, не ломающейся при масштабировании в разных браузерах. Хотелось бы качестве результата темы получить что-то вроде набора  правил, придерживаясь которых верстка не будет ломаться при масштабировании в последних версиях популярных браузеров.
       
      Интересно услышать мнение как экспертов, так и тех кто уже сталкивался с такой проблемой и выработал навык оформления стилей, не дающих ломаться верстке при масштабировании страницы.
    • By Destrifer
      Шрифт 14pt в FF (других браузерах) и Safari - совсем не одно и тоже.
      В 2 блоках вылезают надписи. Разница разительна. Про сголаживание я вообще молчу.
       
      Как решить проблему без костылей?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy