Plateforme Level Extreme
Abonnement
Profil corporatif
Produits & Services
Support
Légal
English
Two controls side by side
Message
 
 
À
16/10/2012 16:27:37
Dragan Nedeljkovich (En ligne)
Now officially retired
Zrenjanin, Serbia
Information générale
Forum:
HTML5
Catégorie:
Autre
Divers
Thread ID:
01555066
Message ID:
01555135
Vues:
35
>>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.
>
>I do it by using divs or ul/li elements, with appropriate settings. Try this for style:
>
clear: none;
>    display: block;
>    float: left;
>
Just in case, this is what I see in the View Source - do you see what needs to be changed?
<div style="display: none">
   <form id="sform">
        <input type="hidden" id="fntype" name="fntype">
        <input type="hidden" id="Id" name="Id">
       
<div class="editor-label">
    <label for="Number">Client No</label>
</div>
<div class="editor-field">
    <input class="text-box single-line" data-val="true" data-val-number="The field Client No must be a number." data-val-required="The Client No field is required." id="Number" name="Number" type="text" value="" />
    <span class="field-validation-valid" data-valmsg-for="Number" data-valmsg-replace="true"></span>
</div>

<div class="editor-label">
    <label for="Name">Client Name</label>
</div>
<div class="editor-field">
    <input class="text-box single-line" data-val="true" data-val-required="The Client Name field is required." id="Name" name="Name" type="text" value="" />
    <span class="field-validation-valid" data-valmsg-for="Name" data-valmsg-replace="true"></span>
</div>
<div class="editor-label">
    <label for="Address">Address</label>
</div>
<div class="editor-field">
    <textarea class="text-box multi-line" id="Address" name="Address">
</textarea>
    <span class="field-validation-valid" data-valmsg-for="Address" data-valmsg-replace="true"></span>
</div>

    
      <div style="clear: none; display: inline; float: left;">
        <div class="editor-label">
            <label for="Contact1">First Contact</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="The field First Contact must be a string with a maximum length of 100." data-val-length-max="100" id="Contact1" name="Contact1" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Contact1" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="Email1">Email1</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="The field Email1 must be a string with a maximum length of 100." data-val-length-max="100" id="Email1" name="Email1" type="email" value="" />
            <span class="field-validation-valid" data-valmsg-for="Email1" data-valmsg-replace="true"></span>
        </div>
        <div id="Phone1">
            <div class="float-left" style ="width:70% ">
                <div class="editor-label">
                    <label for="Phone1">Phone</label>
                </div>
                <div class="editor-field">
                    <input class="text-box single-line" data-val="true" data-val-length="The field Phone must be a string with a maximum length of 10." data-val-length-max="10" id="Phone1" name="Phone1" type="tel" value="" />
                    <span class="field-validation-valid" data-valmsg-for="Phone1" data-valmsg-replace="true"></span>
                </div>
            </div>
            <div class="float-left" style ="width:30% ">
                <div class="editor-label">
                    <label for="Ext1">Ext</label>
                </div>

                <div class="editor-field">
                    <input class="text-box single-line" data-val="true" data-val-length="The field Ext must be a string with a maximum length of 5." data-val-length-max="5" id="Ext1" name="Ext1" type="text" value="" />
                    <span class="field-validation-valid" data-valmsg-for="Ext1" data-valmsg-replace="true"></span>
                </div>
            </div>
        </div>
    </div>
    
    <div class="float-left">

        <div class="editor-label">
            <label for="Contact2">Second Contact</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="The field Second Contact must be a string with a maximum length of 100." data-val-length-max="100" id="Contact2" name="Contact2" type="text" value="" />
            <span class="field-validation-valid" data-valmsg-for="Contact2" data-valmsg-replace="true"></span>
        </div>

        <div class="editor-label">
            <label for="Email2">Email2</label>
        </div>
        <div class="editor-field">
            <input class="text-box single-line" data-val="true" data-val-length="The field Email2 must be a string with a maximum length of 100." data-val-length-max="100" id="Email2" name="Email2" type="email" value="" />
            <span class="field-validation-valid" data-valmsg-for="Email2" data-valmsg-replace="true"></span>
        </div>
        <div id="Phone2">
            <div class="float-left">
                <div class="editor-label">
                    <label for="Phone2">Phone</label>
                </div>
                <div class="editor-field">
                    <input class="text-box single-line" data-val="true" data-val-length="The field Phone must be a string with a maximum length of 10." data-val-length-max="10" id="Phone2" name="Phone2" type="tel" value="" />
                    <span class="field-validation-valid" data-valmsg-for="Phone2" data-valmsg-replace="true"></span>
                </div>
            </div>
            <div class="float-left">
                <div class="editor-label">
                    <label for="Ext2">Ext</label>
                </div>
                <div class="editor-field">
                    <input class="text-box single-line" data-val="true" data-val-length="The field Ext must be a string with a maximum length of 5." data-val-length-max="5" id="Ext2" name="Ext2" type="text" value="" />
                    <span class="field-validation-valid" data-valmsg-for="Ext2" data-valmsg-replace="true"></span>
                </div>
            </div>
        </div>
    </div>

<div class="clear"></div>
<div class="footer">
    <button type="Submit" id="btnSave">Submit</button>
    <button type="reset" id="btnCancel">Cancel</button>
</div>


       
    </form>
</div>
If it's not broken, fix it until it is.


My Blog
Précédent
Suivant
Répondre
Fil
Voir

Click here to load this message in the networking platform