Основные свойства переопределения CSS

Question

Я использую CMS с названием WebsiteBaker, теперь я написал для нее модуль, капельку, которая использует собственный CSS. Кажется, что CSS капли не может быть переопределен основным CSS.

Я предполагаю, что это потому, что капля (и вместе с ней, CSS) загружается после всего остального. И я не могу просто изменить файлы CMS как обходной путь, так как это модуль.

Есть идеи для обхода или что-то подобное?

-

Основной CSS (попытка переопределения, включена в заголовок)

#programma_tab {
    width: 300px;
}

Пример Droplet CSS (включен в тело, другого пути нет)

#programma_tab {
    padding: 5px;
    font-size: 12px;
    margin-top: -15px;
    width: 200px;
}

Answer 1

У меня есть пара идей.

1 - попробуйте сделать селекторы более конкретными. Что-то вроде body следует переопределить оригинал

body #programma_tab {
    padding: 5px;
    font-size: 12px;
    margin-top: -15px;
    width: 200px;
}

2 - попробуйте добавить !important после любого свойства CSS.

#programma_tab {
    padding: 5px !important;
    font-size: 12px !important;
    margin-top: -15px !important;
    width: 200px !important;
}

Answer 2

Если вы используете DropletsExtension for WebsiteBaker, CSS для вашего Droplet может автоматически загружаться в раздел заголовка шаблона, и вам не нужно вставлять жестко закодированный CSS в тело.

Answer 3

Просто добавьте !important Заявление к командам CSS, как:

#programma_tab {
    padding: 5px !important;
    font-size: 12px !important;
    margin-top: -15px !important;
    width: 200px !important;
}

Я знаю, что это, конечно, не самый элегантный способ, но он работает.