0
0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-14 02:24:00 +01:00
Bootstrap/docs/utilities/clearfix.md

988 B

layout title group
docs Clearfix utilities

Easily clear floats by adding .clearfix to the parent element. Utilizes the micro clearfix as popularized by Nicolas Gallagher. Can also be used as a mixin.

{% highlight html %}

...
{% endhighlight %}

{% highlight scss %} // Mixin itself .clearfix() { &:before, &:after { content: " "; display: table; } &:after { clear: both; } }

// Usage as a mixin .element { @include clearfix; } {% endhighlight %}

The following example shows how the clearfix can be used. Without the clearfix the wrapping div would not span around the buttons which would cause a broken layout.

{% example html %}

Example Button pulled left Example Button pullred right
{% endexample %}