Пользовательский CSS на кнопке не работает

#css #button

#css #кнопка

Вопрос:

У меня возникли некоторые пользовательские проблемы с css, о которых я был бы очень признателен за отзывы.

Вот ссылка на то, где я столкнулся с проблемой: http://bookemcreative.com/testsite/regal-pocket-cards /

Вы заметите, что под кнопкой / ссылкой «Просмотр продуктов» есть тень, которая мне не нужна. Я попытался применить к этому некоторый пользовательский css, используя firebug inspector, но не могу понять, что я делаю неправильно. Я все еще изучаю css, поэтому был бы признателен за любую обратную связь. Вот css, который я пробовал:

 a.button.product_type_grouped {
text-shadow: 0px !important;
}
  

Комментарии:

1. Используйте text-shadow: none .

2. Вы уже используете firebug, поэтому проверьте класс css, который создает эту тень, и что происходит, когда вы деактивируете этот атрибут.

3. Может показаться, что вы исправили проблему на своем сайте. Не забудьте выбрать правильный ответ, чтобы он мог помочь пользователям в будущем.

Ответ №1:

Вы пробовали

 a.button.product_type_grouped {
   text-shadow:none !important;
}
  

As 0px не является значением, которое text-shadow будет искать свойство, поэтому используйте none вместо 0px , вы можете увидеть полную документацию text-shadow здесь

Комментарии:

1. Это сработало!! Спасибо. Я не думал об использовании «none», поскольку я использовал px при применении текстовой тени к некоторым кнопкам: 1px 1px 1px #c72c34 !важно;

Ответ №2:

используйте вместо text-shadow: none этого более конкретное правило (поскольку лучше избегать ненужного использования !important )

 #wrapper .button.product_type_grouped  {
   text-shadow: none
}
  

что более конкретно, чем правило, которое вы ранее определили

 #wrapper .button {
    text-shadow: 1px 1px 1px #c72c34;
}
  

Ответ №3:

0px не является допустимым значением.

Попробуйте это:

     a.button.product_type_grouped {
        text-shadow: none !important;
    }