2013-12-24 2 views
1

Таким образом, у меня есть эта кнопка на моем веб-сайте с серым фоном, красной рамкой и красным текстом, и я хочу, чтобы при наведении на нее фон стал красным, а текст стал белым, граница не меняется. Что происходит, когда вы нажимаете мышь на кнопку, цвет границы становится белым, а затем, как только переход закончился, он быстро возвращается к красному.Изменение цвета цвета CSS меняется цвет границы

Обычно я знаю, что этот код должен работать, но я думаю, что, поскольку я использую переход, это не так. Вот полный код CSS:

#leftWebsiteTitle a:link{ 
    display:block; 
    width:200px; 
    padding:7px 10px 7px 14px; 
    margin:37px; 

    font-family:graduate; 
    color:#C83434; 
    border:3px solid #C83434; 
    background:transparent; 
    text-decoration:none; 
    font-size:44px; 
    -webkit-transition: color 300ms, background 300ms; 
    -moz-transition: color 300ms, background 300ms; 
    -o-transition: color 300ms, background 300ms; 
    -ms-transition: color 300ms, background 300ms; 
    transition: color 300ms, background 300ms; 

} 
#leftWebsiteTitle a:visited{ 
    color:#C83434; 
    text-decoration:none; 
} 

#leftWebsiteTitle a:hover{ 
    color:#FFF; 
    border:3px solid #C83434; 
    background:#C83434; 
    text-decoration:none; 
    -webkit-transition: color 100ms, background 100ms; 
    -moz-transition: color 100ms, background 100ms; 
    -o-transition: color 100ms, background 100ms; 
    -ms-transition: color 100ms, background 100ms; 
    transition: color 100ms, background 100ms; 

} 

Любые идеи, почему это не работает? Спасибо!

+0

Свойство hover позволит ему вернуться к оригиналу после того, как элемент больше не вибрирует. – camdixon

+1

Выполняет ли этот код только один раз, а затем возвращается к оригиналу, не отрывая мышь от ссылки? Кроме того, постоянно ли он работает? – camdixon

+0

Не уверен, правильно ли вы поняли проблему. Он возвращается к нему, но на протяжении переходной границы становится белым, чего не должно быть, так как я никогда не пытаюсь изменить цвет границы. – okush69

ответ

1

Так что я нашел проблему не в коде, указанном выше. Я применил переход к div, который содержал эту кнопку, и это то, что мешало этому переходу. Как только я удалил это, он работал нормально.

Смежные вопросы