{{#markdown}}
Using the **.bac** (Block Align Center) class as described on the [helpers](/tetra-ui/doc/helpers.html) page.
{{/markdown}}

<div class="gr gr-zebra">
  <div class="gu gu-1of5 bac"><span class="hide-s">.gu</span> .gu-1of5 .bac</div>
  <div class="gu gu-1of4 bac"><span class="hide-s">.gu</span> .gu-1of4 .bac</div>
  <div class="gu gu-1of3 bac"><span class="hide-s">.gu</span> .gu-1of3 .bac</div>
  <div class="gu gu-1of2 bac"><span class="hide-s">.gu</span> .gu-1of2 .bac</div>
</div>

<div class="code-content">
{{> toggle-code}}
{{#markdown}}
```html
<div class="gr gr-zebra">
  <div class="gu gu-1of5 bac"> ... <div>
  <div class="gu gu-1of4 bac"> ... <div>
  <div class="gu gu-1of3 bac"> ... <div>
  <div class="gu gu-1of2 bac"> ... <div>
</div>
```
{{/markdown}}
{{> copy-code}}
</div>