Re: How to align labels and text boxes

Question

Hi,   I would like to know how to align labels and text boxes so that two appear next to each other as per below image;     I am working in MVC and my view looks as follows; @model EmploymentEquity.Models.EmployerDetails      @{       ViewBag.Title =  "Create" ;   }      Section A: Employer Details          @ using  (Html.BeginForm())   {       @Html.AntiForgeryToken()           class = "form-horizontal" >           @* Employer Details *@                       @Html.ValidationSummary( true ,  "" ,  new  { @ class  =  "text-danger"  })            class = "form-group" >               @Html.LabelFor(model => model.TradeName, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.TradeName,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.TradeName,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.DtiName, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.DtiName,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.DtiName,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.DtiNumber, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.DtiNumber,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.DtiNumber,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.SarsNumber, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.SarsNumber,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.SarsNumber,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.UifNumber, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.UifNumber,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.UifNumber,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.EeNumber, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.EeNumber,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.EeNumber,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >               @Html.LabelFor(model => model.SetaID, htmlAttributes:  new  { @ class  =  "control-label col-md-2"  })                class = "col-md-10" >                   @Html.EditorFor(model => model.SetaID,  new  { htmlAttributes =  new  { @ class  =  "form-control"  } })                   @Html.ValidationMessageFor(model => model.SetaID,  "" ,  new  { @ class  =  "text-danger"  })                                           class = "form-group" >                class = "col-md-offset-2 col-md-10" >                    "submit"  value= "Create"   class = "btn btn-primary btn-block"  />                                       }…

Jignesh Kumar · Accepted Answer

Hi,   You need to use cal class properly to get your desired out put, Please have a look at this link, https://stackoverflow.com/questions/34796445/bootstrap-two-column-layout-for-mvc-create-view