Button Group

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

Show details...

Syntax

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

{{< button
background-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-width="Any valid number with unit like 10px, 1em, 0.8rem, 100vh or 50%"
button-style="default|primary|success|error|link"
is-open-in-new="true|false"
link="Any valid http link"
margin="Top, right, bottom, left property in px,em,rem or %. Ex. 15px, 0, 15px, 0 would imply 15px top, 0px right, and so on."
padding="Top, right, bottom, left property in px,em,rem 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.)"
tooltip-text="Any text" >}}

The actual message goes here

{{< /button >}}

{{< /button-container >}}

Samples