ブートストラップに基づいて画面全体を満たすdivを取得する方法

Question

私はブートストラップを使って自分のコードをレール上のルビーを使ってラップしています。この親クラスの中で、画面全体を塗りつぶしているdiv（スクリーンショットのblue divの例を参照）を追加したいと思います。しかし、それはコンテナのdivのパディングを保持するので、動作しません。何をすべきか？関連タラは次のとおりです。

私は私のビューファイルで

<div class="container"> 
<%= yield %> 
</div> 

を持ってapplication.html.erbで

私は

<div class="row"> 
    <div class="col-md-12 blue">Lorem 
</div> 
</div> 

Answer 1

を持っているようにビューでのCSSを追加します -

<style type="text/css"> 
    body {#add blue class css here} 
</style 
<div class="row"> 
    <div class="col-md-12">Lorem 
    </div> 
</div> 

この方法で追加した後にCSSが機能しない場合は、!importantをCSSに追加してください。

例： -

<style type="text/css"> 
    body {background-color: red !important;} 
</style 
<div class="row"> 
    <div class="col-md-12">Lorem 
    </div> 
</div>