Okuseeyeeya

Toggle floats ku element yonna, okuyita mu breakpoint yonna, nga okozesa responsive float utilities zaffe.

Ku muko guno

Okulaba okutwalira awamu

Ebika bino eby'omugaso bitengejja ekintu ku kkono oba ku ddyo, oba okulemesa okutengejja, okusinziira ku sayizi y'ekifo eky'okulaba ekiriwo kati nga tukozesa ekintu kya CSSfloat . !importantkiyingizibwamu okwewala ensonga ezikwata ku specificity. Bino bikozesa ebifo bye bimu eby’okumenya nga enkola yaffe eya grid. Nsaba omanye nti float utilities tezirina kye zikola ku bintu bya flex.

Float start ku sayizi zonna ez'ekifo eky'okulaba

Float end ku sayizi zonna ez'ekifo eky'okulaba

Totengejja ku sayizi zonna ez'okulaba

html

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

Okuddamu

Enjawulo eziddamu nazo ziriwo ku buli floatmuwendo.

Float start ku viewports ezirina sayizi ya SM (entono) oba okusingawo

Float start ku viewports ezirina sayizi ya MD (medium) oba okusingawo

Float start ku viewports ezirina sayizi ya LG (ennene) oba okusingawo

Float start ku viewports eza sayizi ya XL (extra-large) oba okusingawo

html

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

Wano waliwo emisomo gyonna egy’obuyambi:

.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 nga bwe kiri

Ebikozesebwa API

Float utilities zilangirirwa mu utilities yaffe API mu scss/_utilities.scss. Yiga engeri y'okukozesaamu API y'ebikozesebwa.

    "float": (
      responsive: true,
      property: float,
      values: (
        start: left,
        end: right,
        none: none,
      )
    ),