Горизонтальное расположение в JQuery Mobile
Я работаю над мобильным приложением jquery. В моем приложении у меня есть некоторые данные формы, которые я хочу расположить горизонтально. В настоящее время у меня есть следующее:
<div data-role="content">
<ul data-role="listview">
<li data-role="list-divider">Information Here</li>
</ul><br />
<ul id="myList" data-role="listview" data-inset="true" data-theme="d" data-dividertheme="d">
<li data-role="list-divider">Choice</li>
<li data-role="fieldcontain">
<div class="ui-grid-c">
<div class="ui-block-a" style="font-weight:normal;">From</div>
<div class="ui-block-b">
<select name="selector1" id="selector"1 data-native-menu="false">
<option value="__">Please Choose</option>
</select>
</div>
<div class="ui-block-c" style="font-weight:normal;">To</div>
<div class="ui-block-d">
<select name="selector2" id="selector2" data-native-menu="false">
<option value="__">Please Choose</option>
</select>
</div>
</div>
</li>
</ul>
</div>
Моя задача заключается в том, что подход сетки равномерно разделяет 4 столбца. На самом деле, я просто хочу расположить элементы горизонтально. Мне не нужно, чтобы все было равномерно. Однако я не уверен, как это сделать.
Как мне просто расположить контент горизонтально?
1 ответ
Решение
Примерно так: http://jsfiddle.net/Gajotres/K9duV/
<ul id="myList" data-role="listview" data-inset="true" data-theme="d" data-dividertheme="d">
<li data-role="list-divider">Choice</li>
<li>
<div class="ui-grid-a">
<div class="ui-block-a" style="font-weight:normal;">
<div data-role="fieldcontain" id="left-select">
<label for="selector1">From:</label>
<select name="selector1" id="selector1" data-native-menu="false">
<option value="__">Please Choose</option>
</select>
</div>
</div>
<div class="ui-block-b">
<div data-role="fieldcontain" id="right-select">
<label for="selector2">To:</label>
<select name="selector2" id="selector2" data-native-menu="false">
<option value="__">Please Choose</option>
</select>
<div>
</div>
</div>
</li>
</ul>