Rails bootstrap css按正確順序無法加載

Question

我完全不知道這一點，而我完全陷入困境。我有bootstrap，一個默認的css文件，然後是單個頁面的css文件。我的CSS文件看起來像這樣：

// Place all the styles related to the Hotel controller here. 
// They will automatically be included in application.css. 
// You can use Sass (SCSS) here: http://sass-lang.com/ 
//*= require_self 
//*= require jquery.ui.all 
//*= require bootstrap_and_overrides.css.scss 
//*= require defaults.css.scss 
//*= require_tree ./hotels 

這是它是如何加載：

<link href="/assets/hotels.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 

<link href="/assets/jquery.ui.core.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.theme.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.accordion.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.autocomplete.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.button.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.datepicker.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.dialog.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.progressbar.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.resizable.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.selectable.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.slider.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.tabs.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.base.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/jquery.ui.all.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/bootstrap_and_overrides.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/defaults.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/add_fonts.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 

<link href="/assets/hotels/carousel.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/carousel_side_text.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/directions.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/fileuploader.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/gmaps4rails.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/index.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 
<link href="/assets/hotels/specials.css?body=1" media="screen" rel="stylesheet" type="text/css" /> 

但是，當我檢查的螢火一個元素，那就是：

[東西從一堆引導]

從我的默認文件[CSS] < ----正在被引導的東西覆蓋

[Bootstrap的一堆東西]

所以我不明白。我的默認值是在引導後加載的，但它們正在被bootstrap覆蓋。我不明白這是可能的。

編輯補充：

這是我試圖擺脫對左旁的span7股利。不幸的是，你可以看到我的覆蓋在該塊的中間。 margin-left：0px;正在被覆蓋。

.row-fluid .span7 { 
    width: 57.265%; 
} 
bootst...?body=1 (line 6396) 
.row-fluid [class*="span"] { 
    -moz-box-sizing: border-box; 
    display: block; 
    float: left; 
    margin-left: 2.5641%; 
    min-height: 30px; 
    width: 100%; 
} 
bootst...?body=1 (line 6290) 
.row-fluid .span7 { 
    width: 57.4468%; 
} 
bootst...?body=1 (line 469) 
.row-fluid [class*="span"] { 
    -moz-box-sizing: border-box; 
    display: block; 
    float: left; 
    margin-left: 2.12766%; 
    min-height: 30px; 
    width: 100%; 
} 
bootst...?body=1 (line 363) 
.text-line-buttons { 
    float: left; 
    margin-left: 0; 
    text-align: left; 
} 
**defaul...?body=1 (line 224) 
.span7 { 
    width: 670px; 
}** 
bootst...?body=1 (line 6185) 
[class*="span"] { 
    float: left; 
    margin-left: 30px; 
} 
bootst...?body=1 (line 6141) 
.span7 { 
    width: 540px; 
} 
bootst...?body=1 (line 258) 
[class*="span"] { 
    float: left; 
    margin-left: 20px; 

Answer 1

您是否試過編寫！對您的css文件重要？ 也許是討厭的，但你可以試試... ...

!important css