Как выбрать конкретные элементы CSS?

Я хочу выбрать конкретный элемент, чтобы изменить его свойства (например):

.d-button-label { display: none !important;}

Но затем понял, что этот класс используется повсюду в Discourse, а не только в элементе плагина, который я пытался настроить. Как мне выбрать именно эту метку?

Поднимитесь вверх по дереву HTML и найдите родительский элемент с уникальным классом.

Затем вы можете добавить родительский элемент в свой селектор следующим образом:

.parent-class .child-class {
  display: none;
}

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

.grandparent-class .parent-class .child-class {
  display: none;
}

При необходимости.

То же самое в SCSS будет выглядеть так:

.grandparent-class {
  .parent-class {
    .child-class {
      display: none;
    }
  }
}

Это должно устранить необходимость использования !important.

Спасибо @Johani! Ты только что научил меня чему-то новому, что очень пригодится!