Question

我在jquery mobile中使用了网格来设计页面。我想要一个块正好放在中间。

首先在网格中将有2个块，同样放置，在下一个网格中将有一个块，我希望它居中。

我尝试了一些像

这样的技巧

margin: 0 auto

他们都没有工作。如何在中间采用ui-block并且与上面2个区块具有相同的宽度？（代码在jsfiddle里面）

Answer 1

您可以覆盖JQM ui-block-a类，此处您的块宽度将与第一个网格中的块相同。试试这个DEMO

更改：在您的第二个网格中添加 margin-left：25％; 。

<强>代码：

<div data-role="page">

    <div id="content" data-role="content">
        <div class="ui-grid-a" id="mymenu">
                    <div class="ui-block-a image_class" id="daily_sehri_iftar" style="background:#000000;"><div class="ui-bar ui-bar-a" style="text-align: center">hhh</div></div>
                    <div class="ui-block-b image_class" id="monthly_sehri_iftar" style="background:#000000;"><div class="ui-bar ui-bar-a" style="text-align: center">aaaa</div></div>
                </div>
                <div class="ui-grid-a" id="mymenu">
                    <div class="ui-block-a image_class" id="prayer_time" style="background:#000000;margin-left:25%;"><div class="ui-bar ui-bar-a" style="text-align: center;">aaaaa</div></div>
                </div>
    </div>
</div>

网格中心的一个ui-block - jquery mobile

1 个答案: