title: Span2 Twitter Bootstrap in a Small Div
body: <p>I would like to make a small, two-column menu with bootstrap.  The idea is to have a div that is 200px by 300px high.  The structure would, I think, look like this:</p>
  
  <pre><code>&lt;div id="menu"&gt;
      &lt;div class="container"&gt;
          &lt;div class="row-fluid"&gt;
              &lt;div class="span2"&gt;
                  &lt;div class="span1"&gt;
                      &lt;div class="filterEl"&gt;
                          some text
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="span1"&gt;
                      &lt;div class="filterEl"&gt;
                          some text
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
          &lt;div class="row-fluid"&gt;
              &lt;div class="span2"&gt;
                  &lt;div class="span1"&gt;
                      &lt;div class="filterEl"&gt;
                          some text
                      &lt;/div&gt;
                  &lt;/div&gt;
                  &lt;div class="span1"&gt;
                      &lt;div class="filterEl"&gt;
                          some text
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;              
          &lt;/div&gt;  
      &lt;/div&gt;              
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS:</p>
  
  <pre><code>  .menu{
      width:200px;
      height: 300px;
      background-color:green;
      }
  
      .filterEl{
          position: relative;
          height:40px;
          border: solid black 2px;
      }
  </code></pre>
  
  <p>The issue is that everything gets mashed to the upper left corner of the menu div.  How can I get everything evenly spaced in the meny div as if I were using Bootstrap on a full page?</p>