title: How to make fixed position row in bootstrap?
body: <p>I have a table-like structure, where the first <code>&lt;div class="row"&gt;...</code> behave as the header for the table.<br>
  I am trying to make it fixed, so when I scroll down the page, users can still see the columns headings.<br>
  I gave it position:fixed, which achieves that, but now, the width of the columns is trashed.  </p>
  
  <pre><code>&lt;div class="container"&gt;
              &lt;div class="row" style="position:fixed;"&gt;
                  &lt;div class="col-md-1"&gt;id&lt;/div&gt;
                  &lt;div class="col-md-3"&gt;L Name&lt;/div&gt;
                  &lt;div class="col-md-1"&gt;M&lt;/div&gt;
                  &lt;div class="col-md-2"&gt;F Name&lt;/div&gt;
                  &lt;div class="col-md-3"&gt;Username&lt;/div&gt;
                  &lt;div class="col-md-2"&gt;Phone&lt;/div&gt;
              &lt;/div&gt;&lt;!-- row --&gt;
  &lt;!-- some data --&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-md-1"&gt;id&lt;/div&gt;
                  &lt;div class="col-md-3"&gt;L Name&lt;/div&gt;
                  &lt;div class="col-md-1"&gt;M&lt;/div&gt;
                  &lt;div class="col-md-2"&gt;F Name&lt;/div&gt;
                  &lt;div class="col-md-3"&gt;Username&lt;/div&gt;
                  &lt;div class="col-md-2"&gt;Phone&lt;/div&gt;
              &lt;/div&gt;&lt;!-- row --&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I really needs this to work on Chrome/FF/Safary. IE is not a concerns</p>