CODEWITHSUNDEEP
jqueryhtmlcss
john doe
john doe

Reputation: 9660

Inserting Label Before the Select List

I am using jQuery Mobile to create a page using the following code:

<fieldset data-role="controlgroup" data-type="horizontal">
    <legend>Width:</legend>
    <label>This never gets displayed on the screen</label>
    <select name="select-native-11" id="select-native-11">
        <option value="#">2</option>
        <option value="#">3</option>
        <option value="#">4</option>
    </select>
    <label for="select-native-12">Select Inches</label>
    <select name="select-native-12" id="select-native-12">
        <option value="#">1/2</option>
        <option value="#">1/3</option>
        <option value="#">1/4</option>
    </select>
</fieldset>
</form>

I get the following result:

enter image description here

How can I have the "Width" text and the select elements in a single line?

Upvotes: 1

Views: 631

Answers (1)

khollenbeck
khollenbeck

Reputation: 16157

I am not sure what styles you inherit from jQuery mobile.. But basically you would want something like this.

legend {
    display:inline-block;
    float:left;
}

Demo:

http://jsfiddle.net/eLjqf6Lm/

Upvotes: 5

Related Questions