Boostrap.css制作布局100％宽度/高度

Question

我目前正在使用bootsrap和一个简单的聊天布局。我已经能够根据我的需要对它进行大部分修改。唯一的问题是布局不适应窗口大小（100％高度/宽度）。我想利用整个页面。所有元素都位于一个名为container的div内。我怎么能得到这个适应页面（100％高度/宽度）？ CODEPEN

.conversation-wrap 
{ 
    box-shadow: -2px 0 3px #ddd; 
    padding:0; 
    max-height: 400px; 
    overflow: auto; 
} 
.conversation 
{ 
    padding:5px; 
    border-bottom:1px solid #ddd; 
    margin:0; 

} 

.message-wrap 
{ 
    box-shadow: 0 0 3px #ddd; 
    padding:0; 

} 
.msg 
{ 
    padding:5px; 
    /*border-bottom:1px solid #ddd;*/ 
    margin:0; 
} 
.msg-wrap 
{ 
    padding:10px; 
    max-height: 400px; 
    overflow: auto; 

} 

Answer 1

添加COL-LG-12，您的容器

<div class="container col-lg-12"> 
... 
</div> 

http://codepen.io/anon/pen/ucrog

编辑：也改变

<div class="message-wrap col-lg-8"> 

到

<div class="message-wrap col-lg-9">