Clearfix

Ngwa ngwa na dị mfe ikpochapụ ọdịnaya nke sere n'elu n'ime akpa site n'ịgbakwunye ngwa ngwa clearfix.

Kwuo ngwa ngwa floats site na ịgbakwunye .clearfix na mmewere nne na nna . Enwere ike iji ya mee ihe dị ka mixin.

Jiri na HTML:

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

Koodu isi mmalite mixin:

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

Jiri mixin na SCSS:

.element {
  @include clearfix;
}

Ihe atụ na-esonụ na-egosi otu esi eji clearfix mee ihe. Na-enweghị clearfix, wrapping div agaghị agafe gburugburu bọtịnụ nke ga-eme ka okirikiri nhọrọ ukwuu.

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