How can I set the size of the gap between inline elements in CSS?

Posted by Val M on Stack Overflow See other posts from Stack Overflow or by Val M
Published on 2010-03-01T14:05:36Z Indexed on 2010/04/03 2:53 UTC
Read the original article Hit count: 350

Filed under:

I am creating an MVC 1.0 form to use in multiple views. I have some elements that need to be shown on the same line, and I have done this by setting the display to "display: inline" for the style. I have also added the margin-left setting to the CSS in order to force the gap between the inline elements but this doesn't appear to be being set.

My CSS has:

fieldset label.inline { display: inline; margin-left: 2em; }

The view code is:

<fieldset>
    <legend>Details</legend>
    <p>
        <label for="StartTime">Start Time:</label>
        <%= Html.TextBox("StartTime", Model.StartTime.ToShortTimeString())%>
        <label for="NextDay" class="inline">Next Day?</label>
        <%= Html.CheckBox("NextDay") %>
        <%= Html.ValidationMessage("StartTime", "*")%>
    </p>
</fieldset>

Setting the size in the "margin-left" style has no impact on the space between the StartTime control and the NextDay label. How can I create this gap between the elements?

© Stack Overflow or respective owner

Related posts about css