Конфликт в css

Question

В моем проекте у меня много файлов css, которые заставляют его конфликтовать друг с другом.

Всех элементы в проекте должны иметь плавный стиль CSS

*, *:after, *:before { 
    box-sizing: border-box; } 

пока есть только диалог, который не должен иметь этот CSS

<div id="WebcamPopup"> 
..... 
</div> 

есть решение этой проблемы?

Answer 1

#WebcamPopup, #WebcamPopup *, #WebcamPopup *:after, #WebcamPopup *:before { 
    box-sizing:content-box; 
} 

Сказав, что - вы демонстрируя именно, почему вы не должны делать такие вещи, как инвазивный box-sizing переопределениях во всем мире.

Answer 2

Одним из вариантов может быть переопределение boz-sizing для этого конкретного селектора:

#WebcamPopup, 
#WebcamPopup:before, 
#WebcamPopup:after { box-sizing: content-box; } 

начальное значениеbox-sizing является content-box.

6.1. ‘box-sizing’ property

содержимого коробки
Это поведение ширины и высоты, как указано CSS2.1. Указанная ширина и высота (и соответствующие значения мин/макс.) Применяются к ширине и высоте соответственно поля содержимого элемента. Прокладка и граница элемента: , выложенный и выведенный за пределы указанной ширины и высоты.

Вы также можете использовать ключевое слово initial, если это опция, но обратите внимание, что он не поддерживается в IE.