Source

Plovák

Pomocí našich responzivních plovoucích utilit můžete přepínat plovoucí hodnoty na jakémkoli prvku, přes jakýkoli bod přerušení.

Přehled

Tyto třídy nástrojů plovoucí prvek doleva nebo doprava nebo zakázat plovoucí na základě aktuální velikosti výřezu pomocí vlastnosti CSSfloat . !importantje zahrnuto, aby se předešlo problémům se specifičností. Používají stejné zarážky výřezů jako náš systém mřížky.

Třídy

Přepnout plovoucí objekt s třídou:

Plovoucí vlevo na všech velikostech výřezu

Plovoucí doprava na všech velikostech výřezu

Neplovou na všechny velikosti výřezu 
<div class="float-left">Float left on all viewport sizes</div><br>
<div class="float-right">Float right on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>

Mixins

Nebo od Sass mixin:

.element {
  @include float-left;
}
.another-element {
  @include float-right;
}
.one-more {
  @include float-none;
}

Responzivní

floatPro každou hodnotu existují také responzivní variace .

U výřezů velikosti SM (malé) nebo širších se pohybujte vlevo

Pohybujte se vlevo na výřezech velikosti MD (střední) nebo širších

U výřezů o velikosti LG (velké) nebo širších se pohybujte vlevo

U výřezů velikosti XL (extra-velké) nebo širších doleva 

<div class="float-sm-left">Float left on viewports sized SM (small) or wider</div><br>
<div class="float-md-left">Float left on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-left">Float left on viewports sized LG (large) or wider</div><br>
<div class="float-xl-left">Float left on viewports sized XL (extra-large) or wider</div><br>

Zde jsou všechny třídy podpory;

  • .float-left
  • .float-right
  • .float-none
  • .float-sm-left
  • .float-sm-right
  • .float-sm-none
  • .float-md-left
  • .float-md-right
  • .float-md-none
  • .float-lg-left
  • .float-lg-right
  • .float-lg-none
  • .float-xl-left
  • .float-xl-right
  • .float-xl-none