5

Bootstrap имеет стиль table {border-collapse: collapse; border-spacing:0;}. Я хочу, чтобы изменить это, поэтому я создать класс и применил его к столу в вопросе:Override Bootstrap table border-collapse style

table.FormGroupContainer 
{ 
    border-collapse: separate; 
    border-spacing: 2px; 
} 

но еще границы остаются разрушилась. Инспектор элементов Chrome показывает, что Bootstrap CSS был переопределен, но только отключение стиля в инспекторе допускает интервал между границами. Я наблюдал это в IE 11 и Firefox 31.0. Кроме того, встроенные стили переопределяют (как показано в инспекторе Chrome), но не действуют, пока я не отключу стиль Bootstrap.

CSS загрузка заказ тоже похоже не имеет значения. Что дает? Не является ли класс более высокой специфичностью?

+1

Normalize.css (часть Bootstrap 3) добавляет коллапс. Порядок загрузки CSS всегда имеет значение. Если стиль применяется к таблице, он будет работать при условии, что это после Bootstrap css, и никакие другие css не конфликтуют с ним: http://jsbin.com/bavogi/1/edit – Christina

+0

@Christina Хорошо, скажем, загрузите CSS Bootstrap последним , Не является ли более высокая специфичность 'table.FormGroupContainer':'

'разрешить FormGroupContainer переопределять таблицу Bootstrap CSS? – XyberICE

+0

Да, если это все, что есть. Помните, что это normalize.css, который является частью Bootstrap, но поддерживается отдельно. – Christina

ответ

3

Заказ груза был проблемой здесь. Моя таблица стилей загружалась до Bootstrap. Я добавил большую специфику к правилу в моей таблице стилей, что позволило ему конкурировать с CSS table Bootstrap. Спасибо @Чристина.