Question

Here is my code.

@using (Html.BeginForm()) {
@Html.ValidationSummary()

<fieldset>
    <legend>Registration Form</legend>
    <ol>
        <li>
            @Html.LabelFor(m => m.FirstName)
            @Html.TextBoxFor(m => m.FirstName)
        </li>
    </ol>
 </fieldset>
}

From the code above, the label and the textbox are on separate lines. I want to combine them to be on the same line so I can have something like…

@Html.LablFor(m => m.FirstName): @Html.TextBoxFor(m => m.FirstName)

Should end up looking like FirstName: _______

Thanks in advance.

Answer 1

There must be something wrong with your CSS because <label> and <input> are both inline elements. The only reason they would be appearing on separate lines would be if your CSS are treating them as block elements or if they cannot fit on the same line of content.

Demo in jsFiddle: http://jsfiddle.net/tSFtJ/