Source

Float

Toggle floats fuq kwalunkwe element, fuq kwalunkwe breakpoint, billi tuża l-utilitajiet float reattivi tagħna.

Ħarsa ġenerali

Dawn il-klassijiet ta' utilità jgħollu element lejn ix-xellug jew il-lemin, jew jiskonnettjaw il-floating, abbażi tad-daqs attwali tal-viewport billi tuża l- proprjetà CSSfloat . !importanthija inkluża biex jiġu evitati kwistjonijiet ta' speċifiċità. Dawn jużaw l-istess punti ta' waqfien tal-vista bħas-sistema tal-grilja tagħna. Jekk jogħġbok kun af li l-utilitajiet float m'għandhom l-ebda effett fuq oġġetti flex.

Klassijiet

Aqleb float ma' klassi:

Float xellug fuq id-daqsijiet kollha tal-viewport

Float dritt fuq id-daqsijiet kollha viewport

Tpoġġix f'wiċċ l-ilma fuq id-daqsijiet kollha tal-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>

Mixins

Jew minn Sass mixin:

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

Jirrispondi

Jeżistu wkoll varjazzjonijiet li jirrispondu għal kull floatvalur.

Float xellug fuq viewports daqs SM (żgħir) jew usa

Float xellug fuq viewports daqs MD (medju) jew usa

Float xellug fuq viewports daqs LG (kbar) jew usa

Float xellug fuq viewports ta 'daqs XL (extra-kbar) jew usa' 

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

Hawn huma l-klassijiet ta’ appoġġ kollha;

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