Jquery Mobile：水平按钮，填充容器答案

【问题标题】：Jquery Mobile: Horizontal Buttons, fill containerJquery Mobile：水平按钮，填充容器
【发布时间】：2015-06-09 12:09:31
【问题描述】：

在移动应用程序上工作，我正在尝试创建两个按钮，它们应该会增长并填充它们的容器。

因此，在纵向视图中，两个按钮应占满其父级的整个宽度，而在横向视图中，它们也应增长以填满其整个父级。

根据我在帖子中遇到的建议，我尝试过使用网格，但这似乎不起作用...

按钮不会增长并填充其父级。

<div class="ui-grid-a">
 <div class="ui-block-a">
  <a href="tel:xxxx" class="ui-btn ui-icon-phone ui-btn-icon-left ui-btn-inline">xxxx</a>
 </div>
 <div class="ui-block-b">
  <a href="test" class="ui-btn ui-icon-carat-r ui-btn-icon-right ui-btn-inline">More</a>
 </div>
</div>

附：没有网格布局的单个按钮会增长以正确填充其父容器。

<a href="tel:xxxx" class="ui-btn ui-icon-phone ui-btn-icon-left">xxxx</a>

似乎是ui-btn-inline 导致它没有增长。

【问题讨论】：

只需删除 ui-btn-inline 类。如果您不希望按钮填充容器，则该类是。随着那个类的消失，网格解决方案将起作用。
谢谢，我同时实现了导航栏，而不是网格，并且导航栏也可以完成这项工作。感谢您的评论。
@ezanker，请添加您的解决方案作为答案。
@SteveH.，我已经添加了答案。

标签： javascript jquery jquery-ui jquery-mobile mobile

【解决方案1】：

只需删除 ui-btn-inline 类。

如果您不希望按钮填充容器，则该类是。随着那个类的消失，网格解决方案将起作用。

DEMO

【讨论】：