in English

Da nsuo ani

Toggle floats wɔ element biara so, wɔ breakpoint biara so, de yɛn responsive float utilities no di dwuma.

Nsɛm a Wɔaka abom

Saa utility class ahorow yi de element bi kɔ benkum anaa nifa so, anaasɛ ɛma floating no yɛ adwuma, a egyina mprempren viewport kɛse a wɔde CSS floatagyapade no di dwuma so . !importantno ka ho na ama wɔakwati nsɛm pɔtee a ɛfa nneɛma pɔtee bi ho. Eyinom de viewport breakpoints koro no ara na edi dwuma sɛnea yɛn grid nhyehyɛe no de di dwuma. Yɛsrɛ sɛ hu sɛ float utilities nni nkɛntɛnso biara wɔ flex nneɛma so.

Adesua ahorow

Toggle float bi a ɛwɔ adesuakuw bi mu:

Float benkum wɔ viewport akɛse nyinaa so

Float nifa wɔ viewport akɛse nyinaa so

Mfa nsuo nkɔ viewport akɛseɛ nyinaa so
<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>

Nneɛma a wɔde frafra

Anaasɛ Sass mixin na ɔyɛe:

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

Mmuae a wɔde ma

Nsonsonoe a ɛma mmuae nso wɔ hɔ ma floatbotae biara.

Float benkum wɔ viewports a ne kɛse yɛ SM (ketewa) anaa nea ɛtrɛw so

Float benkum wɔ viewports a ne kɛse yɛ MD (medium) anaa nea ɛtrɛw so

Float benkum wɔ viewports a ne kɛse yɛ LG (kɛse) anaa nea ɛtrɛw so

Float benkum wɔ viewports a ne kɛse yɛ XL (extra-large) anaa nea ɛtrɛw so

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

Mmoa adesua ahorow no nyinaa ni;

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