Android 标题内右对齐的div与导航栏断开至另一行

我正在努力尝试在头球中得到一个俯冲，而导航杆在右边距有问题：

<div data-role="header"> 
  <div id="profile_navbar" data-role="navbar">
    <ul>
      <li><a href="#">My Profile</a></li>
      <li><a href="#">Events</a></li>
      <li><a href="#">Settings</a></li>
    </ul>
  </div>

  <div id="profile_navb_right">
    <img src="http://i.imgur.com/aN396n8.png" />
    <img src="http://i.imgur.com/RAoRPLt.png" />
  </div>
</div>

在

#profile_navb_right

上使用css尝试了许多方法，但总是将第二个div清除到另一行：

---

谢谢

只需将块的

float

属性设置为

left

和

right

#profile_navbar
{
    float:left;
    /* other stuff */
}
#profile_navbar_right
{
    float:right;
    /* other stuff */
}

---

使用

ui网格

响应式布局解决您的问题

ui-grid-a

，

ui-block-a

和

ui-block-b

。此外，为

ui网格

提供一个类或ID以避免与其他

ui网格

布局重叠也很重要

标记

<div class="ui-grid-a navbar">
 <div class="ui-block-a">
  <div id="profile_navbar" data-role="navbar">
   <ul>
    <li><a href="#">My Profile</a></li>
    <li><a href="#">Events</a></li>
    <li><a href="#">Settings</a></li>
   </ul>
  </div>
 </div>
 <div class="ui-block-b">
  <div>
   <img src="img.png" />
   <img src="img.png" />
  </div>
 </div>
</div>

---

只是让它粘在同一行上，尽管仍然粘在左边而不是右边，你可以使用

ui网格
，它也被
navbar
使用，并覆盖CSS，因为在这个例子中，CSS像一个符咒一样工作，tyvm不客气，我将添加它作为一个答案。要尝试一下，非常感谢，我唯一的CSS打印是：#profile_navbar{width:75%；}哦…我的答案只是瞎猜。编辑它。效果很好，虽然，看起来标题就在第一个div后面：尝试添加“ui-bar-a”类您的个人资料。我从来没有使用过cordova，所以我很难猜到。添加到您的容器div中。效果更好。
.ui-grid-a.navbar > .ui-block-a {
 width: 80% !important;
}

.ui-grid-a.navbar > .ui-block-b {
 width: 20% !important;
 text-align: center;
}