title: Applying Bootstrap css in MVC view
body: <p>I'm using Bootstrap css </p>
  
  <p>view :</p>
  
  <pre><code>    &lt;div class="container"&gt;
      @using (Html.BeginForm(new { @class="form-horizontal"}))
  {
      @Html.ValidationSummary(true)
  
  
  
     &lt;div class="form-group"&gt;
         @Html.LabelFor(model =&gt; model.Rank_name, new { @class = "control-label col-sm-2" })
      &lt;div class="col-sm-10"&gt;
              @Html.TextBoxFor(model =&gt; model.Rank_name, new { @class = "form-control" })
              @Html.ValidationMessageFor(model =&gt; model.Rank_name)
      &lt;/div&gt;
    &lt;/div&gt;
  
     &lt;div class="form-group"&gt;
         @Html.LabelFor(model =&gt; model.rank_code, new { @class = "control-label col-sm-2" })
      &lt;div class="col-sm-10"&gt;
              @Html.TextBoxFor(model =&gt; model.rank_code, new { @class = "form-control" })
              @Html.ValidationMessageFor(model =&gt; model.rank_code)
      &lt;/div&gt;
    &lt;/div&gt;
     &lt;div class="form-group"&gt;
         @Html.LabelFor(model =&gt; model.Target_amount, new { @class = "control-label col-sm-2" })
      &lt;div class="col-sm-10"&gt;
              @Html.TextBoxFor(model =&gt; model.Target_amount, new { @class = "form-control" })
              @Html.ValidationMessageFor(model =&gt; model.Target_amount)
      &lt;/div&gt;
    &lt;/div&gt;
          &lt;div class="form-group"&gt;        
            &lt;div class="col-sm-offset-2 col-sm-10"&gt;
                &lt;input type="submit" value="Create" class="btn btn-default" /&gt;
  
            &lt;/div&gt;
          &lt;/div&gt;
  
  
  }
      &lt;/div&gt;
  </code></pre>
  
  <p>but I'm not getting the output exactly what i want, 
  <img src="https://i.stack.imgur.com/vPdrd.png" alt="enter image description here"></p>
  
  <p>I have used this  format 
  <a href="http://www.w3schools.com/bootstrap/tryit.asp?filename=trybs_ref_form-horizontal&amp;stacked=h" rel="nofollow noreferrer">Horizontal form</a></p>
  
  <p>but there is no space between those boxes and the box size is too long .I mean its not good format .what should i do?</p>
  
  <p>Edited:
  and my Layout :</p>
  
  <pre><code> &lt;head&gt;
   @Styles.Render("~/Content/css")
          @Scripts.Render("~/bundles/modernizr")
  
          &lt;script src="~/Scripts/bootstrap.min.js"&gt;&lt;/script&gt;
          &lt;link href="~/Content/bootstrap.min.css" rel="stylesheet" /&gt;
   &lt;/head&gt;
  </code></pre>
  
  <p>Edited 2:</p>
  
  <p>I have put bootstap.css before the cite.css  then i got space between those boxes and box sizes are within that div tag 
  but the entire page font size is very very small .I can't read those text.</p>