Button Group

A button group uses the same set of buttons, but it stacks them together so that they don't have gaps in between. Rest of the functionality remains the same.

Show Full Syntax...

Syntax

{{< button-group-container
background-color="any background or gradient"
is-full-width="true|false"
margin="Top, right, bottom, left property in px or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
padding="Top, right, bottom, left property in px or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
text-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
text-line-height="Any valid number with unit like 10px, 10rem or 50%"
text-size="Any valid number with unit like 10px, 10rem or 50%" >}}

{{< button-group-item
background-color="any background or gradient"
background-hover-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
border-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
border-hover-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
border-width="Any valid number with unit like 10px or 10rem"
button-style="default|success|warning|error"
is-open-in-new="true|false"
link="Any valid http link"
margin="Top, right, bottom, left property in px or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
padding="Top, right, bottom, left property in px or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
text-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
text-hover-color="Any valid color in rgba, hex, hsla, hwba (note: every format allows setting alpha/opacity.)"
tooltip-text="Any text" >}}

The actual message goes here

{{< /button-group-item >}}

{{< /button-group-container >}}