Skip to content

Web Design Weekly

  • SPONSORSHIP

Sass Clearfix Mixin

by Jake

There are a few ways to implement the clearfix hack but the following Sass Mixin has been in my toolbox for the last year thanks to this article on Nicolas Gallaghers blog.

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

Usage:

.article {
     @include clearfix();
}
Categories Sass, Snippets
Linking to an Image Folder Within a WordPress Theme
How to change the Input Font Size based on Text Length
  • CSS
  • Housekeeping
  • Inspiration
  • JavaScript
  • Link
  • Newsletter
  • Performance
  • Resources
  • Sass
  • Screencast
  • Snippets
  • WordPress
  • Workflow

Learn

Blog
Archive

Contact

Home
Contact
Sponsorship
Privacy Policy

© 2011-2023 Web Design Weekly. All Rights Reserved.