Поплавък

Преглед

Тези помощни класове преместват елемент отляво или отдясно или дезактивират плаващото въз основа на текущия размер на прозореца за изглед, използвайки свойството CSSfloat . !importantе включен, за да се избегнат проблеми със специфичността. Те използват същите точки на прекъсване на изгледа като нашата мрежова система. Моля, имайте предвид, че помощните програми за плаващи елементи нямат ефект върху гъвкавите елементи.

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

Отзивчив

floatЗа всяка стойност също съществуват адаптивни вариации .

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

Ето всички класове за поддръжка:

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

дързък

API за помощни програми

Float помощните програми са декларирани в нашия API за помощни програми в scss/_utilities.scss. Научете как да използвате API на помощните програми.

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