Question

我一直在玩jQuery mobile和PhoneGap，调查为平板电脑上的某些内容创建应用程序的可能性。

我希望能够创建一个类似于jQuery UI上显示的示例的格式工具栏，但是使用jQuery mobile。不幸的是，当我尝试将多个控制组项放在一起时，它们每个都在页面上自己的行上而不是在同一行上彼此相邻：

<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元素。有什么想法吗？

Answer 1

如果您向两个控制组添加display:inline-block;个样式，只要有足够的屏幕空间，它们就会出现在同一行。

examle

在jquery mobile中使用多个组格式化工具栏

1 个答案: