Skip to content

Instantly share code, notes, and snippets.

@ifamily
Last active April 1, 2018 20:40
Show Gist options
  • Star 4 You must be signed in to star a gist
  • Fork 2 You must be signed in to fork a gist
  • Save ifamily/6779332 to your computer and use it in GitHub Desktop.
Save ifamily/6779332 to your computer and use it in GitHub Desktop.
This CSS will fix problems caused by Genesis Column Classes of uneven height. Just add a div with the class name of clear-line to your code. Then add this to your .css file.
/*
Clear fix for column classes
---------------------------------------------------------------------------------------------------- */
.clear-line:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clear-line {
display: inline-block;
width: 100%;
}
html[xmlns] .clear-line {
display: block;
}
* html .clear-line {
height: 1%;
}
@phocks
Copy link

phocks commented Feb 21, 2016

Thanks heaps for this. It worked perfectly. Just had to add <div class="clear-line"></div> in my page text code in the WordPress editor after the code for the Genesis columns.

@MattRyanCo
Copy link

Puuuuuurfect !

@NicBeltramelli
Copy link

Thanks, it works perfectly.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment