css - jquery mobile lineup controls in a line -
how lineup form controls select boxes , others in line in jquery vs having them displayed vertically?
<label for="select-choice-0" class="select">shipping method:</label> <select name="select-choice-0" id="select-choice-1"> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select> <label for="select-choice-2" class="select">shipping method:</label> <select name="select-choice-2" id="select-choice-2"> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select>
i don't want them in same fieldset data-type="horizontal". thanks
alternative example using css , data-inline="true" tag
css
#inline-select-container { overflow:auto; } #inline-select-left { float:left; } #inline-select-right { float:right; }
html
<div data-role="page" class="type-home"> <div data-role="content"> <div id="inline-select-container"> <div id="inline-select-left"> <select name="select-choice-0" id="select-choice-1" data-inline="true"> <option >shipping method</option> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select> </div> <div id="inline-select-right"> <select name="select-choice-2" id="select-choice-2" data-inline="true"> <option >shipping method</option> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select> </div> </div> <br /> <br /> <div id="inline-select-container"> <div id="inline-select-left"> <label for="select-choice-0" class="select">shipping method:</label> <select name="select-choice-0" id="select-choice-1" data-inline="true"> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select> </div> <div id="inline-select-right"> <label for="select-choice-2" class="select">shipping method:</label> <select name="select-choice-2" id="select-choice-2" data-inline="true"> <option value="standard">standard: 7 day</option> <option value="rush">rush: 3 days</option> <option value="express">express: next day</option> <option value="overnight">overnight</option> </select> </div> </div> </div> </div>
Comments
Post a Comment