# container

The markup of every demo on <https://kuiper.oeds.it/container/>, extracted from that
page. It is generated, so it cannot disagree with what the page renders.

Load the framework from the origin and read <https://kuiper.oeds.it/docs/KUIPER.md> first:
a Kuiper class carries no prefix and a UIkit behavior attribute carries `data-`.

## container

Varies: the `container-*` ladder over 5 rungs, `xs` to `xl`.

```html
<div data-grid class="grid-xs">
 <div class="width-1-1"><div class="card"><div class="container background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container</p></div></div></div></div>
 <div class="width-1-1"><div class="card"><div class="container container-xs background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container-xs</p></div></div></div></div>
 <div class="width-1-1"><div class="card"><div class="container container-s background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container-s</p></div></div></div></div>
 <div class="width-1-1"><div class="card"><div class="container container-m background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container-m</p></div></div></div></div>
 <div class="width-1-1"><div class="card"><div class="container container-l background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container-l</p></div></div></div></div>
 <div class="width-1-1"><div class="card"><div class="container container-xl background-gray-xlight"><div class="card background-white padding-xs-vertical"><p>container-xl</p></div></div></div></div>
</div>
```