Columns

vel-src: layout.css

Utilities for controlling the number of columns within an element.

Class	Properties
vel-columns-1	columns: 1
vel-columns-2	columns: 2
vel-columns-3	columns: 3
vel-columns-4	columns: 4
vel-columns-5	columns: 5
vel-columns-6	columns: 6
vel-columns-auto	columns: auto

Examples

Multi-column layout

First column content goes here. VeloraCSS multi-column layout.

Second column picks up where the first left off automatically.

Third column completes the layout with balanced columns.

example.html

<div class="vel-columns-3 vel-gap-4" style="color:#94a3b8;font-size:13px;line-height:1.6">
  <p>First column content goes here. VeloraCSS multi-column layout.</p>
  <p>Second column picks up where the first left off automatically.</p>
  <p>Third column completes the layout with balanced columns.</p>
</div>