After running my code, the output looks something like this:
<div class="container col-sm-4" style="background-color: wheat">
<form action="/AwfulSite/Search/Index" class="form-horizontal" method="post" role="form">
<div class="form-group">
<label class="col-sm-2 control-label" for="FirstName" style="text-align: right">FirstName</label>
<input class="form-control col-sm-10" id="FirstName" name="FirstName" type="text" value="">
</div>
</form>
</div>
I'm confused as to why the label and input field are displaying on separate lines. I specifically set the form layout to be horizontal. How can I make them align horizontally?