title: Bootstrap: Is there a way to get a tighter layout?
body: <p>Just curious if there is a way to get a tighter layout with bootstrap.</p>
  
  <p>Why is there so much space between the text elements?
  <img src="https://i.stack.imgur.com/pCgLS.png" alt="too much space"></p>
  
  <p>Is it all just to accomodate pads, phones, etc?</p>
  
  <p>Is there any way to choose a tighter style for the entire page to default to?</p>
  
  <p>I also think the edit boxes themsselves are too large.  There is too much wasted space between the text and the edge of the box.</p>
  
  <p>Why aren't they a bit tighter?</p>
  
  <hr>
  
  <hr>
  
  <p><strong>These edits have been added after attempting to use code in answer from NetworkNerd</strong></p>
  
  <p>I have added the following to my stylesheet.</p>
  
  <pre><code>  input[type=text]{
         padding-top:0px; padding-bottom:0px;
         margin-bottom:0px; /* Reduced from whatever it currently is */
         margin-top:0px; /* Reduced from whatever it currently is */
         height:24px;
      }
  </code></pre>
  
  <p>Those additions make my form look like the following:</p>
  
  <p><img src="https://i.stack.imgur.com/LunkT.png" alt="doesn&#39;t quite work"></p>
  
  <p>You can see that things got a bit tighter, but that is only because of the <code>height:24px</code> style.</p>
  
  <p>The other changes do not seem to have any affect on the look.</p>
  
  <p>By the way, the stylesheet which includes this change is the last one included.</p>
  
  <p><strong>Labels Are Not Aligned</strong></p>
  
  <p>Also, notice that now that I've changed that the labels are not aligned with their associated text input.</p>
  
  <p><strong>Still Too Much Margin Between Text Boxes</strong></p>
  
  <p>And there still seems to be too much margin space between the text boxes.</p>
  
  <p><strong>HTML Code Snippet For Title</strong></p>
  
  <p>Here's a snippet of the HTML which shows the HTML with the applied Bootstrap styles.
  This was all just copied from samples on the bootstrap site.</p>
  
  <pre><code>&lt;form class="form-horizontal" role="form"&gt;
          &lt;div class="form-group"&gt;
              &lt;label for="titleText" class="col-sm-2 control-label"&gt;Title&lt;/label&gt;
              &lt;div class="col-sm-6"&gt;
                  &lt;input id="titleText" class="form-control" type="text" ng-model="book.title" /&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>