javascript - Jquery Mobile : Horizontal Buttons,填充容器

Question

在开发移动应用程序时，我尝试创建两个按钮，它们应该增大并填充其容器。

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

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

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

<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 导致它无法增长。

Answer 1

只需删除 ui-btn-inline 类即可。

如果您不希望按钮填充容器，则该类。当这个类消失后，网格解决方案就可以工作了。

DEMO