Hi everybody,

I want to have the following layout

text1

text2

Contact1                                   Contact2
Name                                         Name
email                                          email
phone ext                                  phone ext

So, I want Contact1 and Contact2 controls to be side by side and also the same for phone controls.

I found this http://welovecss.com/showthread.php?t=465 and I tried implementing it this way:

<div id="Contacts">
    <div id="leftcolumn">
        <div class="editor-label">
            @Html.LabelFor(model => model.Contact1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Contact1)
            @Html.ValidationMessageFor(model => model.Contact1)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Email1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Email1)
            @Html.ValidationMessageFor(model => model.Email1)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Phone1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Phone1)
            @Html.ValidationMessageFor(model => model.Phone1)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Ext1)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Ext1)
            @Html.ValidationMessageFor(model => model.Ext1)
        </div>
    </div>
    <div id="rightcolumn">
        <div class="editor-label">
            @Html.LabelFor(model => model.Contact2)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Contact2)
            @Html.ValidationMessageFor(model => model.Contact2)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Email2)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Email2)
            @Html.ValidationMessageFor(model => model.Email2)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Phone2)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Phone2)
            @Html.ValidationMessageFor(model => model.Phone2)
        </div>

        <div class="editor-label">
            @Html.LabelFor(model => model.Ext2)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Ext2)
            @Html.ValidationMessageFor(model => model.Ext2)
        </div>
    </div>
    <div class="clear"></div>
</div>

but it doesn't seem to work at all. How can I correctly and nicely put them side by side without using table?

Thanks in advance.