Float

vel-src: layout.css

Utilities for controlling the wrapping of content around an element.

Class	Properties
vel-float-left	float: left
vel-float-right	float: right
vel-float-none	float: none
vel-clearfix	::after { content: ''; display: table; clear: both }

Examples

Float right

Float Right

Text flows around the floated element. Using vel-float-right moves the element to the right edge of its container.

example.html

<div style="background:#1a2236;border:1px solid #1e2d45;border-radius:8px;padding:16px;overflow:auto">
  <div class="vel-float-right vel-bg-primary vel-text-white vel-rounded-md" style="padding:8px 16px;margin-left:12px">Float Right</div>
  <p style="color:#94a3b8;font-size:14px">Text flows around the floated element. Using vel-float-right moves the element to the right edge of its container.</p>
</div>