picnic
Version:
A lighweight CSS library with nice defaults and many plugins to kickstart your projects
55 lines (49 loc) • 945 B
Markdown
## Card
A card is a self-contained, replicable type. It works great with other of its kind. It can consist of only one element or many of them:
```html
<article class="card">
<header>
<h3>A really simple h3</h3>
</header>
</article>
```
```html
<article class="card">
<header>
<button>Love</button>
<button class="dangerous">Hate</button>
</header>
</article>
```
```html
<article class="card">
<header>
<h3>Forest</h3>
</header>
<footer>
<button>Like</button>
</footer>
</article>
```
```html
<div class="flex two">
<div>
<article class="card">
<img src="/web/img/forest.jpg">
<footer>
<h3>Misty Forest</h3>
<button>Like</button>
</footer>
</article>
</div>
<div>
<article class="card">
<img src="/web/img/forest.jpg">
<footer>
<h3>Misty Forest</h3>
<button>Like</button>
</footer>
</article>
</div>
</div>
```