我正在尝试将jquerymobile移动设备(使用版本1.3)并排自动完成并自动完成,但是自动完成搜索框未与选择菜单对齐并且在顶部被切断。
我试过这个
<div class="ui-grid-a">
<div class="ui-block-a" style="float:left;">
<label for="TargetTypeList" class="ui-hidden-accessible">All Uses</label>
<select name="TargetTypeList" id="TargetTypeList">
<option value="standard">Standard: 7 day</option>
<option value="rush">Rush: 3 days</option>
</select>
</div>
<div class="ui-block-b" style="float:left;">
<ul data-role="listview" data-inset="true" data-filter="true" data-filter-reveal="true" data-filter-placeholder="Search cars...">
<li><a href="#">Acura</a></li>
<li><a href="#">Audi</a></li>
<li><a href="#">BMW</a></li>
<li><a href="#">Cadillac</a></li>
<li><a href="#">Chrysler</a></li>
<li><a href="#">Dodge</a></li>
<li><a href="#">Ferrari</a></li>
<li><a href="#">Ford</a></li>
<li><a href="#">GMC</a></li>
<li><a href="#">Honda</a></li>
<li><a href="#">Hyundai</a></li>
<li><a href="#">Infiniti</a></li>
<li><a href="#">Jeep</a></li>
<li><a href="#">Kia</a></li>
<li><a href="#">Lexus</a></li>
<li><a href="#">Mini</a></li>
<li><a href="#">Nissan</a></li>
<li><a href="#">Porsche</a></li>
<li><a href="#">Subaru</a></li>
<li><a href="#">Toyota</a></li>
<li><a href="#">Volkswagen</a></li>
<li><a href="#">Volvo</a></li>
</ul>
</div>
(现场演示:http://jsfiddle.net/gE44j/)和表格布局没有运气。
有关如何正确格式化它们的任何想法吗?
答案 0 :(得分:1)
jQM在过滤器输入周围添加负边距。尝试添加此CSS:
.ui-listview-filter-inset {
margin: 4px 0 0 0 !important;
}
<强> UPDATED FIDDLE 强>