Javascript jquery mobile中具有多个组的格式化工具栏

我一直在使用jQuery mobile和PhoneGap，研究在平板电脑上创建内容创建应用程序的可能性

我希望能够创建一个类似于上所示示例的格式化工具栏，但使用jQuery mobile。不幸的是，当我尝试将多个controlgroup项目放在一起时，它们都会在页面上各自的行上结束，而不是在同一行上彼此相邻：

<div data-role="footer" data-position="fixed">
  <div data-role="controlgroup" data-type="horizontal" >
    <a href="#" data-role="button" data-icon="arrow-u" data-iconpos="notext">One</a>
    <a href="#" data-role="button" data-icon="arrow-d" data-iconpos="notext">Two</a>
    <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Three</a>
  </div>
  <div data-role="controlgroup" data-type="horizontal" >
    <a href="#" data-role="button" data-icon="arrow-u" data-iconpos="notext">Four</a>
    <a href="#" data-role="button" data-icon="arrow-d" data-iconpos="notext">Five</a>
    <a href="#" data-role="button" data-icon="delete" data-iconpos="notext">Six</a>
  </div>
</div>

---

这将在页脚中的两行结束。我尝试过使用data inline=“true”，但它似乎对div元素不起作用。有什么想法吗？

如果添加

显示：内联块两个控件组的样式只要有足够的屏幕空间，它们将显示在同一行上