On a razor view I have noticed that the spacing between two TextBoxFor controls is different than the spacing between a DropDownListFor and a TextBoxFor. I have looked for a css file that controls this but there does not seem to be specific one for the controls. Spacing between Id and Status is consistent, but spacing between Status and Rep is smaller.

<div class="form-group form-group-tight ">
  <label class="col-md-4 control-label input-sm">Customer Id:</label>
  <div class="col-md-8">
    @Html.TextBoxFor(m => m.Customer.Id, new { @class = "form-control input-sm", @readonly = "true", @id = "CustomerIdDisplay" })
  </div>
</div>
<div class="form-group form-group-tight ">
  <label class="col-md-4 control-label input-sm">Order Status:</label>
  <div class="col-md-8">
    @Html.DropDownListFor(m => m.Order.OrderStatusId, new SelectList(Model.FilteredOrderStatues, "Id", "Name"), new { @class = "form-control input-sm-select" })
  </div>
</div>
  <div class="form-group form-group-tight ">
      <label class="col-md-4 control-label input-sm">Sales Rep:</label>
      <div class="col-md-8">
          @Html.DropDownListFor(m => m.Order.SalesRepId, new SelectList(Model.SalesReps, "Id", "FullName"), String.Empty, new { @class = "form-control input-sm-select", @id= "salesrep-selection" })
      </div>
  </div>

enter image description here

Related posts

Recent Viewed