如何在jquery移动1.4.5中正确对齐触发器
如何在jquery移动1.4.5中正确对齐触发器
提问于 2015-10-24 05:52:19
我试图为用JQM和PhoneGap创建的移动应用程序创建一个“首选”页面。
翻转开关出现在文本的正前方，但没有对齐(就像本机首选项/设置通常显示的那样)，因此看起来非常混乱。
这两个帖子是相似的：如何在jQuery移动固定标头的右角制作触发器？ 如何在jQuery手机中对齐切换开关
但这两种方法都不能很好地解决我的问题(在第一个链接中，它看起来很糟糕；在第二个链接中，它不是flipswitch元素)
我的代码示例：
http://jsfiddle.net/JTGE6/23/
HTML
<label for="radiog_lite_Selec" class="lablsett">Selec</label>
<select name="radiog_lite_Selec" data-mini="true" id="radiog_lite_Selec" data-role="flipswitch" style="position: absolute; right: 0;">
<option value="1">On</option>
<option value="0">Off</option>
</select> css
.ui-mobile label.lablsett
{
left: 0 !important;
float: left;
margin-right: 10px;
margin-left: 10px;
margin-top: 10px;
color: #000;
}我的问题:如何将标签文本标记在左边和触发器(在文本前面)而对齐到右边呢？
谢谢!
回答 1
Stack Overflow用户
回答已采纳
发布于 2015-10-24 14:10:34
将每个选项行放在一个容器div中：
<div class="optContainer">
<label for="radiog_lite_Selec" class="lablsett">Select</label>
<select name="radiog_lite_Selec" data-mini="true" id="radiog_lite_Selec" data-role="flipswitch" style="position: absolute; right: 0;">
<option value="1">On</option>
<option value="0">Off</option>
</select>
</div>然后使用CSS将flipswitch浮动到右侧：
.ui-mobile label.lablsett {
left: 0 !important;
float: left;
margin-right: 10px;
margin-left: 10px;
margin-top: 10px;
color: #000;
}
.optContainer .ui-flipswitch {
float: right;
margin-right: 10px;
}更新的小提琴
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/33314978
复制相关文章
相似问题
腾讯云开发者
