A super minimal clearfix utility.
Scales patterns use the Sass CSS preprocessor, you'll need either Ruby Sass or LibSass.
- NPM:
npm install --save scales-utilities-clearfix
- Bower:
bower install --save scales-utilities-clearfix
Clearfix is used to force an element to self-clear its floated children.
It should be extended in your sass files, but can be used as a class. I recommend only using it this way for debugging purposes in you browser dev tools.
.parent-class {
@extend %clearfix
}
For debugging:
<div class="clearfix">
<some floated elements>
</div>
%clearfix
- extend in your sass files.clearfix
- For debugging, change with the$clearfix-class
variable.
$clearfix-class
All Scales patterns expose the $scales-namespace
variable.
$scales-namespace
accepts a string that will prefix all Scales classes. The default value is null
.
To give all Scales classes a namespace, you will need to set this variable in a file that is imported before any scales files. For example:
@import your-project/settings; // $scales-namespace is set in this file
@import your-project/scales; // Imports the Scales library
@import your-project/project // The rest of your project imports