5

Bootstrap ma styl table {border-collapse: collapse; border-spacing:0;}. Chcę to zmienić tak mam utworzyć klasę i zastosować je do tabeli w pytaniu:Zastępowanie stylu przewijania krawędzi tabeli Bootstrap

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

ale nadal granice pozostają upadł. Inspektor elementów Chrome pokazuje, że CSS Bootstrap został nadpisany, ale tylko wyłączenie stylu w inspektorze pozwala na odstępy między ramkami. Zauważyłem to w IE 11 i Firefox 31.0. Style wewnętrzne również wydają się zastępować (jak pokazano w Inspektorze Chrome), ale nie mają żadnego efektu, dopóki nie wyłączę stylu Bootstrap.

Kolejność ładowania CSS również nie ma znaczenia. Co daje? Czy klasa nie jest wyższa?

+1

Normalize.css (część Bootstrap 3) dodaje zwinięcie. Kolejność ładowania CSS zawsze robi różnicę. Jeśli styl zostanie zastosowany do tabeli, będzie działał pod warunkiem, że działa po Bootstrap css i żadne inne css nie będzie z nim konfliktu: http://jsbin.com/bavogi/1/edit – Christina

+0

@ Christina Ok, powiedzmy, że CSS Bootstrapa jest załadowany jako ostatni . Czy wyższa specyficzność 'table.FormGroupContainer' na:'

'pozwala klasie FormGroupContourer na przesłonięcie CSS tabeli Bootstrap? – XyberICE

+0

Tak, jeśli to wszystko. Pamiętaj, że jest to plik normalize.css, który jest częścią Bootstrap, ale jest przechowywany osobno. – Christina

Odpowiedz

3

Kolejność ładowania była tutaj problemem. Mój arkusz stylów był ładowany przed Bootstrap. Dodałem większą specyfikę do reguły w moim arkuszu stylów, która pozwoliła jej konkurować z CSS Bootstrapa o table. Dzięki @ Christina.

Powiązane problemy