title: How to reduce height between components on bootstrap 3 MVC 5
body: <p>Can someone please tell me what needs to be implemented in the code bellow to adjust (decrease) the height between the components?</p>
  
  <p>I have tried several combinations, including using margin-bottom:5px in each possible component but at no result.</p>
  
  <p>NOTE: I found this solution (Bootstrap 2) but it didn't worked on my case.
  <a href="https://www.google.com/url?sa=t&amp;rct=j&amp;q=&amp;esrc=s&amp;source=web&amp;cd=1&amp;cad=rja&amp;ved=0CCkQFjAA&amp;url=https://stackoverflow.com/questions/12942310/reduce-height-between-bootstrap-form-components&amp;ei=zha5UsjPOqb82gXt4IHICA&amp;usg=AFQjCNHyoOoOi-89t2QMuMFu3u8BD3oibg&amp;bvm=bv.58187178,d.b2I" rel="nofollow noreferrer">Reduce height between bootstrap form components</a></p>
  
  <p>The closest think I found on bootstrap.css (related to the above answer) was the one bellow, which I promptly set to 1px but nothing changed</p>
  
  <pre><code>.form-group {
    margin-bottom: 1px; 
  }
  </code></pre>
  
  <p>// THIS IS THE SAMPLE CODE:</p>
  
  <pre><code>@model Models.Customer
  
  @using (Html.BeginForm())
  {
      @Html.AntiForgeryToken()
  
      &lt;form role="form"&gt;
  
          &lt;div class="form-group input-group-sm"&gt;
              @Html.LabelFor(model =&gt; model.Name, new { @class = "control-label input-sm" })
              @Html.TextBoxFor(model =&gt; model.Name, new { @class = "form-control input-sm" })
          &lt;/div&gt;
  
          &lt;div class="form-group input-group-sm"&gt;
              @Html.LabelFor(model =&gt; model.Address1, new { @class = "control-label input-sm" })
              @Html.TextBoxFor(model =&gt; model.Address1, new { @class = "form-control input-sm" })
          &lt;/div&gt;
  
          &lt;div class="form-inline input-group-sm" role="form"&gt;
              &lt;div class="col-md-4"&gt;
                  @Html.LabelFor(model =&gt; model.City, new { @class = "control-label input-sm" })
                  @Html.TextBoxFor(model =&gt; model.City, new { @class = "form-control input-sm" })
              &lt;/div&gt;
  
              &lt;div class="col-md-4"&gt;
                  @Html.LabelFor(model =&gt; model.State, new { @class = "control-label input-sm" })
                  @Html.TextBoxFor(model =&gt; model.State, new { @class = "form-control input-sm" })
              &lt;/div&gt;
  
              &lt;div class="col-md-4"&gt;
                  @Html.LabelFor(model =&gt; model.Zip, new { @class = "control-label input-sm" })
                  @Html.TextBoxFor(model =&gt; model.Zip, new { @class = "form-control input-sm" })
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;div class="form-group"&gt;
                  &lt;div class="col-md-offset-2 col-md-10"&gt;
                      &lt;input type="submit" value="Create" class="btn btn-default" /&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
      &lt;/form&gt;
  }
  
  @section Scripts {
      @Scripts.Render("~/bundles/jqueryval")
  }
  </code></pre>