bootstrap導航欄可垂直展開

Question

我正在嘗試將導航欄導航欄固定在頂部（我已經完成）並使其可垂直展開。

我想把谷歌地圖和我在這個導航欄中的所有控件固定在頂部，並使其可以垂直展開，以便用戶可以以響應的方式更改其大小。

我的導航欄和谷歌地圖的div代碼：

  <div class="navbar navbar-default navbar-fixed-top"> 
      <div class="col-lg-8"> 
      <div class="row"> 
       <div id="map_canvas"></div>    
      </div> 

     </div> 

編輯：我加了的jsfiddle，我不能添加，因爲API密鑰的谷歌地圖，所以我把一個圖像，而不是它的同一個基本

https://jsfiddle.net/ajzp3vsf/1/

所以圖像固定在導航欄頂部我想要做的就是讓導航欄垂直擴展的有點像文本字段在這裏計算器。

Answer 1

你的意思是這樣的，還必須添加您的迴應類圖，這是畫面小提琴

https://jsfiddle.net/DTcHh/18151/

<div class="container"> 
     <!-- Static navbar --> 
     <nav class="navbar navbar-default"> 
     <div class="container-fluid"> 
      <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> 
       <span class="sr-only">Toggle navigation</span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
       <span class="icon-bar"></span> 
      </button> 
      </div> 
      <div id="navbar" class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
       <li> 
       <img class="img-responsive" src="http://lorempixel.com/400/200/sports/1/" />   
       </li> 
      </ul> 
      </div><!--/.nav-collapse --> 
     </div><!--/.container-fluid --> 
     </nav> 
</div> <!-- /container -->