ich ein Gitter bin mit, dies zu tun, und eine zusätzliche CSS-Regel:
.ui-controlgroup-horizontal > div > .ui-btn {
width: 99%
}
Der Grund Ich mache das ist, dass das Markup wie folgt ist:
<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>
Wird von jquery in m umgewandelt arkup wie folgt aus (inspizieren es in Chrome oder Firebug):
<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>
Wie Sie sehen können, die .ui-btn
wir wollen innerhalb 100% breit sein ist ui-block-a
(oder ui-block-b
, ui-block-c
, etc.), und unsere horizontalen Steuer Gruppe hat die Klasse .ui-controlgroup-horizontal
gewonnen, daher die Regel: .ui-btn
Kinder von divs
Kinder von .ui-controlgroup-horizontal
sind (fast) 100% gemacht. Ich höre kurz vor 100% auf, weil dies die abgerundeten Ecken auf der rechten Seite für mich hackt. Wenn Sie .ui-controlgroup-horizontal
für die oberste Klasse und nicht (sagen wir) ui-grid-a
verwenden, funktioniert diese Regel für verschiedene Rastergrößen.
danke, es ist Arbeit – RogerWu
froh, Hilfe zu sein. Könnten Sie die Antwort als akzeptiert markieren? –
Nicht sehr elegant, funktioniert mit großen Bildschirmen, aber nicht pixelgenau. –