in English
Da nsuo ani
Toggle floats wɔ element biara so, wɔ breakpoint biara so, de yɛn responsive float utilities no di dwuma.
Wɔ kratafa yi so
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 float
agyapade no di dwuma so . !important
no 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.
Float fi ase wɔ viewport akɛse nyinaa so
Float end wɔ viewport akɛseɛ nyinaa so
Mfa nsuo nkɔ viewport akɛseɛ nyinaa so
<div class="float-start">Float start on all viewport sizes</div><br>
<div class="float-end">Float end on all viewport sizes</div><br>
<div class="float-none">Don't float on all viewport sizes</div>
Mmuae a wɔde ma
Nsonsonoe a ɛma mmuae nso wɔ hɔ ma float
botae biara.
Float fi ase wɔ viewports a ne kɛse yɛ SM (ketewa) anaa nea ɛtrɛw so
Float fi ase wɔ viewports a ne kɛse yɛ MD (medium) anaa nea ɛtrɛw so
Float fi ase wɔ viewports a ne kɛse yɛ LG (kɛse) anaa nea ɛtrɛw so
Float fi ase wɔ viewports a ne kɛse yɛ XL (extra-large) anaa nea ɛtrɛw so
<div class="float-sm-start">Float start on viewports sized SM (small) or wider</div><br>
<div class="float-md-start">Float start on viewports sized MD (medium) or wider</div><br>
<div class="float-lg-start">Float start on viewports sized LG (large) or wider</div><br>
<div class="float-xl-start">Float start on viewports sized XL (extra-large) or wider</div><br>
Mmoa adesua ahorow no nyinaa ni:
.float-start
.float-end
.float-none
.float-sm-start
.float-sm-end
.float-sm-none
.float-md-start
.float-md-end
.float-md-none
.float-lg-start
.float-lg-end
.float-lg-none
.float-xl-start
.float-xl-end
.float-xl-none
.float-xxl-start
.float-xxl-end
.float-xxl-none
Sass
Nneɛma a wɔde di dwuma API
Wɔabɔ float utilities ho dawuru wɔ yɛn utilities API mu wɔ scss/_utilities.scss
. Sua sɛnea wode utilities API no bedi dwuma.
"float": (
responsive: true,
property: float,
values: (
start: left,
end: right,
none: none,
)
),