Source

Kotepa

Toggle ba flotteurs na élément nionso, na kati ya point de rupture nionso, na kosalelaka ba utilitaires na biso ya flotteur oyo ezo répondre.

Botali ya mozindo

Ba classes oyo ya utilitaire e flotter élément moko na gauche to droite, to e désactiver flottant, selon taille ya port de vue ya lelo na nzela ya propriété CSSfloat . !importantezali na kati mpo na koboya makambo ya spécificité. Yango esalelaka ba points de rupture ya port de vue ndenge moko na système na biso ya grille. Svp bozala conscient ya ba utilitaires flotteurs ezalaka na affect moko te na ba éléments flex.

Bakelasi

Toggle flotteur na classe moko:

Flotter na gauche na ba taille nionso ya viewport

Flotter na droite na ba taille nionso ya viewport

Ko flotter te na ba taille nionso ya viewport 
<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>

Ba mixins

To na mixin ya Sass:

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

Koyanola

Bokeseni ya eyano ezali mpe mpo na floatmotuya moko na moko.

Flotter na gauche na ba viewports ya taille SM (moke) to ya large

Flotter na gauche na ba viewports ya taille MD (moyenne) to ya large

Flotter na gauche na ba viewports ya taille LG (ya munene) to ya large

Flotter na gauche na ba viewports ya taille XL (extra-large) to ya large 

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

Tala ba classes nionso ya soutien;

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