Buttons

Cross browser compatibility

IE9 doesn’t crop background gradients on rounded corners, so we remove it. Related, IE9 jankifies disabled button elements, rendering text gray with a nasty text-shadow that we cannot fix.

Button Shortcode Description
[button style='1' caption='Default' link='button url'][/button] Standard gray button with gradient
[button style='2' caption='Primary' link='button url'][/button] Provides extra visual weight and identifies the primary action in a set of buttons
[button style='3' caption='Info' link='button url'][/button] Used as an alternative to the default styles
[button style='4' caption='Success' link='button url'][/button] Indicates a successful or positive action
[button style='5' caption='Warning' link='button url'][/button] Indicates caution should be taken with this action
[button style='6' caption='Danger' link='button url'][/button] Indicates a dangerous or potentially negative action
[button style='7' caption='Inverse' link='button url'][/button] Alternate dark gray button, not tied to a semantic action or use
[button style='8' caption='Link' link='button url'][/button] Deemphasize a button by making it look like a link while maintaining button behavior

Leave a Comment