Form basic > Action buttons > Incorrectly positioned
In our basic form example we have the following:
However, according to button documentation we say the following:
Order
Buttons are ordered by importance from right to left. This means primary buttons are always on the right followed by secondary buttons, and so on. As an effect it means buttons with dismissive actions are on the left and buttons with affirmative actions are on the right. Depending on the context, the primary, affirmative action may be destructive.
Positioning
Buttons are positioned towards the right and are placed next to each other when there are multiple. This applies to buttons with affirmative, dismissive, and destructive actions. Therefore:
-
Submit
should be to the far right -
Reset
should be to the left ofSubmit
and the copy should change fromReset
toCancel
to match what we more regularly use in The Product.