我使用一个网格,做到这一点,和一个额外的CSS规则:
.ui-controlgroup-horizontal > div > .ui-btn {
width: 99%
}
原因我这样做是这样的标记:
<div class="ui-grid-a" data-role="controlgroup" data-type="horizontal">
<div class="ui-block-a">
<button type="submit" data-theme="c">Cancel</button>
</div>
<!-- etc -->
</div>
被jquery转换成m arkup像这样(检查它在Chrome或萤火虫):
<div class="ui-grid-a ui-corner-all
ui-controlgroup ui-controlgroup-horizontal"
data-role="controlgroup" data-type="horizontal">
<div class="ui-block-a">
<div data-corners="true" data-shadow="true"
data-iconshadow="true" data-inline="null"
data-wrapperels="span" data-icon="null" data-iconpos="null"
data-theme="c" data-mini="false"
class="ui-btn ui-btn-up-c ui-corner-left"
aria-disabled="false">
<span class="ui-btn-inner ui-corner-left">
<span class="ui-btn-text">Cancel</span>
</span>
<button type="submit" data-theme="c" class="ui-btn-hidden" aria-disabled="false">Cancel</button>
</div>
</div>
<!-- etc -->
</div>
正如你所看到的,我们希望成为宽100%的.ui-btn
里面ui-block-a
(或ui-block-b
,ui-block-c
等),和我们的水平控制组获得.ui-controlgroup-horizontal
,因此规则:.ui-btn
divs
子女.ui-controlgroup-horizontal
的子女被制成(几乎)100%。我停止了100%,因为这为我打了右手边的圆角。通过在顶级类别上使用.ui-controlgroup-horizontal
,而不是(比如)ui-grid-a
,此规则适用于不同的网格大小。
谢谢你,它的工作 – RogerWu
高兴能有所帮助。你能将答案标记为已接受吗? –
不是很优雅,适用于宽屏幕,但不是完美的像素。 –