100% высота дива в загрузчике

Question

У меня есть этот кусок кода с начальной загрузкой ...

<div class="container-fluid"> 
    <div class="row"> 
     <div class="col-md-10"> 
      <div class="panel panel-info"> 
       <div class="panel-heading">CHAT</div> 
       <div class="panel-body">text</div> 
      </div> 
     </div> 
     <div class="col-md-2"> 
      <div class="panel panel-primary"> 
       <div class="panel-heading">ONLINE</div> 
       <div class="panel-body">text</div> 
      </div> 
     </div> 
    </div> 
</div> 

мне нужно иметь столбцы быть высотой 100% и панелями в том, что колоннах быть 100% также.

Спасибо за помощь ур.

Answer 1

Вы пробовали:

.row { 
    min-height: 100vh; } 

Answer 2

Если вы установили высоту класса до 100%, и это не похоже, чтобы сделать разницу, убедитесь, что это родительский объект (. Бывший орган или HTML) являются также установлено равным 100%

Answer 3

Вот что-то, что может вам помочь.

Живой пример HERE

HTML

<div class="your-div"> 
    // Contents 
</div> 

CSS

.your-div { 
    background-color: #ccc; 
} 

JS

//Gets the current height of the screen. 
var screenHeight = $(window).height(); 
var yourDiv = $('.your-div'); 

// Assign that height to the .row 
yourDiv.css({ 
    'height': screenHeight + 'px', 
}); 

// This makes the div's height responsive when you resize the screen or the window of the browser. 
$(window).resize(function() { 
    screenHeight = $(window).height(); 
    yourDiv.css({ 
     'height': screenHeight + 'px', 
    }); 
}); 

Живой образец HERE