Button Group

Layout buttons to fit buttons snugly together.

HTML attributes:

class

Custom attributes:

formactions

With three Buttons, one ghosted and one of type info:

{{< hackcss-buttongroup >}}
  {{< hackcss-button text="Left" />}}
  {{< hackcss-button type="info" >}}Middle{{< /hackcss-button >}}
  {{< hackcss-button text="Right" isghost="true" />}}
{{< /hackcss-buttongroup >}}

With three Buttons styled using class attribute:

<style>.btn-text button::after { content: attr(class) }</style>
{{< hackcss-buttongroup class="btn-text" >}}
  {{< hackcss-button />}}
  {{< hackcss-button type="info" />}}
{{< /hackcss-buttongroup >}}

With two Buttons inside a Form using formactions attribute:

{{< hackcss-form action="/search" >}}
  {{< hackcss-textinput type="hidden" name="s" value="button" >}}
  {{< hackcss-buttongroup formactions="true" >}}
    {{< hackcss-button text="Print" action="javascript:window.print()" />}}
    {{< hackcss-button text="Search" type="primary" isghost="true" />}}
  {{< /hackcss-buttongroup >}}
{{< /hackcss-form >}}