in English
Clearfix
Dali ug dali nga paghawan ang naglutaw nga sulud sa sulod sa usa ka sudlanan pinaagi sa pagdugang usa ka gamit sa clearfix.
Sayon nga klaro float
ang s pinaagi sa pagdugang .clearfix
sa elemento sa ginikanan . Mahimo usab nga gamiton ingon usa ka mixin.
Paggamit sa HTML:
<div class="clearfix">...</div>
Ang mixin source code:
@mixin clearfix() {
&::after {
display: block;
clear: both;
content: "";
}
}
Gamita ang mixin sa SCSS:
.element {
@include clearfix;
}
Ang mosunud nga pananglitan nagpakita kung giunsa magamit ang clearfix. Kung wala ang clearfix ang wrapping div dili molibot sa mga buton nga mahimong hinungdan sa usa ka guba nga layout.
<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>