OverviewThe fr:button component behaves like a regular push-button, but it is rendered in a platform independent way. You use a fr:button just like you would use an xforms:trigger, for instance:
<fr:button>
<xforms:label>Click me</xforms:label>
<xforms:action ev:event="DOMActivate">...</xforms:action>
</fr:button>
StylingBy default, buttons are sized depending on their content. Hence, a button with a longer label will be wider than a button with a shorter label. In certain cases, you want a number of buttons to have a width you choose, rather than their size being dictated by their content. You can do this with CSS; for instance, the following will set the width of the buttons on your form to 15em:
.xbl-fr-button .first-child { width: 15em }
.xbl-fr-button .first-child button { width: 100% }
| 
