Source

Tuytuy

Mayqin elemento kaqpipas, mayqin p'akiy chimpapipas, kutichiq float yanapakuyniykuwan llamk'achispa.

Hatun qhawariy

Kay yanapakuy clasekuna huk elementota lluq'iman utaq pañaman wayt'achin, utaq mana unupi purichiyta atichinchu, kunan qhaway punku sayayninpi CSS floatkaqninta llamk'achispa . !importantnisqa churasqa kachkan mana especificidad nisqamanta sasachakuykuna kananpaq. Kaykunaqa kikin qhaway punku p'akiykunata llamk'achinku imaynachus sistema de rejillaykuwan. Ama hina kaspa, yachay flotador utilidadkuna mana afectankuchu flex elementokunapi.

Clases

Huk flotadorta huk clasewan tikray:

Llapan qhaway punku sayaykunapi lluq'iman wayt'ay

Llapan qhawana sayaykunapi pañaman phaway

Ama tukuy qhaway punku sayaykunapi wayt'aychu 
<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>

Mixinkuna

O por Sass mixin:

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

Kutichiq

floatSapa chaniyuqpaqpas kanmi kutichiy variaciones .

SM (huch'uy) utaq aswan anchoyuq qhaway punkukunapi lluq'iman phaway

MD (chawpi) utaq aswan anchoyuq qhaway punkukunapi lluq'iman phaway

LG (hatun) utaq aswan anchoyuq qhawanakunapi pañaman phaway

XL (extra-hatun) utaq aswan anchoyuq qhawanakunapi lluq'iman phaway 

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

Kaypi llapa yanapakuy clasekuna kachkan;

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