Plavák

Prepínajte plávajúce objekty na ľubovoľnom prvku, cez akýkoľvek bod prerušenia, pomocou našich responzívnych plávajúcich nástrojov.

Prehľad

Tieto pomocné triedy umiestňujú prvok doľava alebo doprava alebo zakážu plávanie na základe aktuálnej veľkosti výrezu pomocou vlastnosti CSSfloat . !importantje zahrnutá, aby sa predišlo problémom so špecifickosťou. Používajú rovnaké body prerušenia zobrazenia ako náš mriežkový systém. Prosím, uvedomte si, že plávajúce nástroje nemajú žiadny vplyv na flexibilné položky.

triedy

Prepnúť float s triedou:

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

Mixins

Alebo podľa Sass mixin:

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

Responzívne

floatPre každú hodnotu existujú aj responzívne variácie .

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

Tu sú všetky triedy podpory;

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