Не удается применить CSS из расширения Chrome в пользовательских таблицах стилей

Question

Я пытаюсь скрыть рекламу в правой части писем в Gmail. Для этого я сделал расширение, которое применяет стиль CSS.

"content_scripts": [
    {
      "matches": ["https://mail.google.com/mail/*", "https://*/*"],
      "css": ["css/hide.css"]
    }
  ]

Содержимое hide.css :

div.nH.HbF0O{ display: none; }

Если я проверю этот CSS в файле %userprofile%\Local Settings\Application Data\Google\Chrome\User Data\Default\User StyleSheets\Custom.css , реклама исчезнет. Если я загружаю расширение, оно не работает.

Если я введу другие стили в файле CSS, например, body {display: none;} или что-то простое, то CSS будет применен.

В чем может быть проблема?

Answer 1

Возможно, это длинный путь , но я думаю, что никогда не видел код CSS, такой как div.nH.HbF0O{ display: none; }

• Вы имели в виду div.nH, div.HbF0O{ display: none; } ?
• или вы имеете в виду "потомок" и пропустите пробел: div.nH .HbF0O{ display: none; } ?

Изменить: я проверил, что CSS div.nH.HbF0O{} может ссылаться на HTML <div class="nH HbF0O" /> поэтому я могу ошибаться.

Answer 2

Я только что поиграл с простым расширением Chrome, которое применяет некоторые стили CSS, и обнаружил, что стилизация веб-страницы будет иметь приоритет над стилизацией расширений.

Попробуйте ударить !important в конце вашей декларации, например

div.nH.HbF0O { display: none !important; }

и посмотрим, решит ли это вашу проблему.