in English

Kureremba

Toggle ireremba hejuru yikintu icyo aricyo cyose, hejuru yikintu icyo ari cyo cyose, ukoresheje ibikorwa byacu bireremba.

Kuriyi page

Incamake

Aya masomo yingirakamaro areremba ikintu ibumoso cyangwa iburyo, cyangwa guhagarika kureremba, ukurikije ubunini bwa none bwo kureba ukoresheje umutungo wa CSSfloat . !importantirimo kugirango wirinde ibibazo byihariye. Ibi bikoresha ibice bimwe byo kureba nka sisitemu ya gride. Nyamuneka umenye ko kureremba ibikorwa bidafite ingaruka kubintu bya flex.

Kureremba kureremba hejuru yubunini bwose

Ntureremba hejuru yubunini bwose

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>

Igisubizo

Guhindura ibisubizo nabyo birahari kuri buri floatgaciro.

Kureremba kureremba kubireba bingana na SM (nto) cyangwa mugari

Ubwato butangirira kubireba ubunini bwa MD (hagati) cyangwa mugari

Float tangira kubireba ubunini bwa LG (nini) cyangwa mugari

Ubwato butangirira kubireba ubunini bwa XL (birenze-binini) cyangwa mugari

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>

Dore ibyiciro byose byingoboka:

.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

Ibikorwa API

Ibikorwa byubwato byatangajwe mubikorwa byacu API muri scss/_utilities.scss. Wige gukoresha ibikoresho API.

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