Separated box
Separated box that can be used in various ways
Basic
Cell 1
Cell 2
Cell 3
<div class="separated">
<div class="separated-cell">Cell 1</div>
<div class="separated-cell">Cell 2</div>
<div class="separated-cell">Cell 3</div>
</div>
Options
| Options | class |
|---|---|
| Background color (box) | .separated.bg-* |
| Background color (cell) | .separated-cell.bg-* |
| Size (small) | .separated-cell.size-small |
| Size (medium) | .separated-cell.size-medium |
| Size (large) | .separated-cell.size-large |
| Action (hover, focus) | .separated.hover |
| Centered text | .separated.center |
| Column | .separated.column |
| Border (box) | .separated.border |
Example
Cell 1
Cell 2
Cell 3