Label and text box on the same line using css

When creating a new asp.net mvc3 app you get the logon and register form with a label above the text field. I want to change it so that both the label and field are on the same line and aligned

The following doesn't work

@using (Html.BeginForm()) {
<div>
    <fieldset>
        <legend>Account Information</legend>

        <div class="editor-label">
            @Html.LabelFor(m => m.UserName)
        </div>
        <div class="editor-field">
            @Html.TextBoxFor(m => m.UserName)
            @Html.ValidationMessageFor(m => m.UserName)
        </div>

        <div class="editor-label">
            @Html.LabelFor(m => m.Password)
        </div>
        <div class="editor-field">
            @Html.PasswordFor(m => m.Password)
            @Html.ValidationMessageFor(m => m.Password)
        </div>

        <div class="editor-label">
            @Html.CheckBoxFor(m => m.RememberMe)
            @Html.LabelFor(m => m.RememberMe)
        </div>

        <p>
            <input type="submit" value="Log On" />
        </p>
    </fieldset>
</div>

CSS:

.display-label, 
.editor-label 
{
      display:inline-block;
      width: 200px;    
      text-align: right;   
      margin-right: 10px;

}

.display-field, 
.editor-field 
{
    display:inline-block;
     margin: 0.5em 0 0 0;
}