Pluti

Comutați flotanți pe orice element, peste orice punct de întrerupere, folosind utilitarele noastre de răspuns.

Prezentare generală

Aceste clase de utilitate plasează un element la stânga sau la dreapta sau dezactivează flotarea, pe baza dimensiunii actuale a ferestrei de vizualizare folosind proprietatea CSSfloat . !importanteste inclus pentru a evita problemele de specificitate. Acestea folosesc aceleași puncte de întrerupere ca și sistemul nostru de grilă. Vă rugăm să rețineți că utilitățile flotante nu au niciun efect asupra articolelor flexibile.

Clase

Comutați un float cu o clasă:

<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>

Mixine

Sau prin Sass mixin:

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

Receptiv

Există și variații de răspuns pentru fiecare floatvaloare.

<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>

Aici sunt toate clasele de suport;

• .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