Гузаштан ба мундариҷаи асосӣ Ба новбари ҳуҷҷатҳо гузаред
Check
in English

Clearfix

Бо илова кардани утилитаи clearfix мундариҷаи шиношударо дар дохили контейнер зуд ва ба осонӣ тоза кунед.

floatБо илова кардани .clearfix элементи волидайн s-ро ба осонӣ тоза кунед . Инчунин метавонад ҳамчун омехта истифода шавад.

Дар HTML истифода баред:

<div class="clearfix">...</div>

Рамзи сарчашмаи омехта:

@mixin clearfix() {
  &::after {
    display: block;
    clear: both;
    content: "";
  }
}

Миксинро дар SCSS истифода баред:

.element {
  @include clearfix;
}

Мисоли зерин нишон медиҳад, ки чӣ тавр clearfix-ро истифода бурдан мумкин аст. Бидуни ислоҳи равшан, div печонидашуда дар атрофи тугмаҳо паҳн намешавад, ки боиси вайроншавии тарҳ мегардад.

html
<div class="bg-info clearfix">
  <button type="button" class="btn btn-secondary float-start">Example Button floated left</button>
  <button type="button" class="btn btn-secondary float-end">Example Button floated right</button>
</div>