in English
Clearfix
Schnell an einfach schwammen Inhalt an engem Container läschen andeems Dir e Clearfix Utility bäidréit.
Einfach kloer float
s andeems Dir .clearfix
un d'Elterenelement bäidréit . Kann och als Mixin benotzt ginn.
Benotzt an HTML:
<div class="clearfix">...</div>
De Mixin Quellcode:
@mixin clearfix() {
&::after {
display: block;
clear: both;
content: "";
}
}
Benotzt de Mixin an SCSS:
.element {
@include clearfix;
}
Déi folgend Beispill weist wéi de Clearfix ka benotzt ginn. Ouni de Clearfix géif d'Wrapping Div net ëm d'Knäpper spannen, wat e futtis Layout verursaacht.
<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>