Source

ምንስፋፍ

ኣብ ዝኾነ ባእታ፡ ኣብ ዝኾነ ነጥቢ ምብታኽ፡ ንዝንሳፈፉ ምላሽ ዝህቡ ተንሳፈፍቲ ዩቲሊቲታትና ብምጥቃም ተንሳፋፊ ምቕያር።

ሓፈሻዊ ትሕዝቶ

እዞም ናይ ዩቲሊቲ ክፍልታት ንሓደ ባእታ ናብ ጸጋም ወይ ንየማን ይንሳፈፍዎ፣ ወይ ድማ ተንሳፋፊ የሰናኽሉ፣ ኣብቲ ሕጂ ዘሎ ዓቐን ቪውፖርት መሰረት ብምግባር CSS floatንብረት ብምጥቃም ። !importantፍሉይነት ዝምልከት ሕቶታት ንኸይፍጠር ተኻቲቱ ኣሎ። እዚኦም ከምቲ ናይ ግሪድ ስርዓትና ተመሳሳሊ ናይ ቪውፖርት ምብታኽ ነጥብታት ይጥቀሙ።

ክፍልታት

ንሓደ ፍሎት ምስ ሓደ ክፍሊ ምቕያር፤

ኣብ ኩሉ ዓቐናት ቪውፖርት ንጸጋም ተንሳፈፍ

ኣብ ኩሉ ዓቐናት ቪውፖርት ንየማን ተንሳፈፍ

ኣብ ኩሉ ዓቐናት ቪውፖርት ኣይትንሳፈፍ
<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>

ሚክሲን ዝበሃሉ ምዃኖም ይፍለጥ

ወይ ብ Sass mixin፤

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

ምላሽ ዝህብ

floatንነፍሲ ወከፍ ክብርታት ምላሽ ዝህቡ ፍልልያት እውን ኣለዉ ።

ኣብ SM (ንእሽቶ) ወይ ካብኡ ንላዕሊ ዝዓቐኑ ቪውፖርት ንጸጋም ተንሳፈፍ

ኣብ MD (ማእከላይ) ወይ ካብኡ ዝሰፍሐ ስፍሓት ዘለዎም ቪውፖርት ንጸጋም ተንሳፈፍ

ኣብ LG (ዓቢ) ወይ ካብኡ ንላዕሊ ዝዓቐኑ ቪውፖርት ንጸጋም ተንሳፈፍ

ኣብ XL (ተወሳኺ-ዓቢ) ወይ ካብኡ ዝሰፍሐ ስፍሓት ዘለዎም ቪውፖርት ንጸጋም ተንሳፈፍ

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

ኩሎም ናይ ደገፍ ክፍልታት ኣብዚ ኣለዉ፤

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