title: How to make the top row of a Bootstrap grid fill the entire screen
body: <p>A common, modern design technique for responsive websites is to use a screen-height element as the above-the-fold content wrapper, and have all other content available below. <strong><a href="https://www.html5andbeyond.com/fullscreen-website-design-100-window-height-div/" rel="nofollow">Here's a good discussion</a></strong> on this technique. Here's <strong><a href="http://codepen.io/html5andblog/full/aFsBo/" rel="nofollow">a demo at CodePen</a></strong>:</p>
  
  <pre><code>#fullscreen {
      width: 100%;
      height: 100%;
      display: table;
  }
  
  #fullscreen .fullscreen-content {
      display: table-cell;
      text-align: center;
      vertical-align: middle;
  }
  
  &lt;div id="fullscreen"&gt;
      &lt;div class="fullscreen-content"&gt;
      ... 
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>How can I make a Bootstrap 3 row behave in this manner? </p>