Zum Hauptinhalt springen
VelinStyle v1.2.0
⌂ Startseite
  1. Docs
  2. Utilities
  3. Float

Float 1.2.0

Schalte Floats fuer beliebige Elemente mit logischen Float-Utilities um. English: Float

Reifegrad: Dokumentiert als stabil in VelinStyle 1.2.0. Studio und die vollstaendige Utility Engine bleiben geplant — ausgelieferte Utilities werden manuell unter @layer utilities, kein vollstaendiger Variantengenerator.

Wann verwenden

Wann nicht

Float Klassen

<div class="velin-float-start">Float start (left in LTR)</div>
<div class="velin-float-end">Float end (right in LTR)</div>
<div class="velin-float-none">No float</div>

Responsiv Floats

Responsiv variants exist for each breakpoint:

<div class="velin-float-sm-start">Float start on sm+</div>
<div class="velin-float-md-end">Float end on md+</div>
<div class="velin-float-lg-none">No float on lg+</div>

Clearfix

Clear floated children by adding .velin-clearfix to the parent:

<div class="velin-clearfix">
  <img class="velin-float-start" src="..." alt="...">
  <p>Text wrapping around the floated image...</p>
</div>