css - 如何在 jquery mobile 中正确使用 ui-btn-left 和 ui-btn-right 类

Question

如何正确使用ui-btn-left和ui-btn-right类

这就是我想要的

这就是我得到的

这是我的 jsfiddle

我的代码

<div  class="ui-bar ui-bar-b ui-btn-corner-all bar" data-theme="a">
  <div class="ui-btn-left"   >
     <a id="btnlogout" href="javascript:void(0);" data-role="button" class="ui-btn-left btnlogout" data-inline="true" data-theme="a">Disconnect</a>
      <a data-role="button" href="javascript:void(0);"  class="imgInfo ui-btn-right" data-mini="true" data-inline="true" style="width:45px;height:45px;" data-theme="a">   </a>
    </div>
 <div class="ui-btn-right" >
       <a  data-role="button" href="javascript:void(0);" class="imgRefresh" data-mini="true" data-inline="true" style="width:45px;height:45px;" onclick="getunreadmessage();" data-theme="a"></a>
   </div>
</div>

Answer 1

我认为也许有更好的方法。但是，这里有一个快速修复方法。您可以添加:

.ui-btn-right {
    float: right;
}

.ui-btn-left {
    float: left
}

和<br style="clear: both" />在你的 <div class="ui-btn-right" > 之后清除 float

Updated Fiddle