Skip to content

Instantly share code, notes, and snippets.

@flexseth
Last active August 29, 2015 14:09
Show Gist options
  • Save flexseth/1aae57615544365688c0 to your computer and use it in GitHub Desktop.
Save flexseth/1aae57615544365688c0 to your computer and use it in GitHub Desktop.
CSS to create Genesis Column Classes with the sample team - Template v. 1.9
/****** STYLESHEET HEADER *****/
/* Not needed, only for clarification that you are using the correct theme */
/*
Theme Name: Genesis Sample
Description: This is the sample theme created for the Genesis Framework.
Author: StudioPress
Author URI: http://www.studiopress.com/
Version: 1.9
Tags: black, orange, white, one-column, two-columns, three-columns, fixed-width, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready
Template: genesis
Template Version: 1.9
License: GPL-2.0+
License URI: http://www.opensource.org/licenses/gpl-license.php
*/
/***** INSTRUCTIONS *****/
/** Replace your page wrap with 1152px if your page is smaller or larger **/
/* 04f - Column Classes ----------- */
.five-sixths,
.four-fifths,
.four-sixths,
.one-fifth,
.one-fourth,
.one-half,
.one-sixth,
.one-third,
.three-fifths,
.three-fourths,
.three-sixths,
.two-fifths,
.two-fourths,
.two-sixths,
.two-thirds {
float: left;
margin-left: 4.166666666%; /* 48px / 1152px */
}
.one-half,
.three-sixths,
.two-fourths {
width: 47.9166666666%; /* 552px / 1152px */
}
.one-third,
.two-sixths {
width: 30.555555555%; /* 352px / 1152px */
}
.four-sixths,
.two-thirds {
width: 65.277777777%; /* 752px / 1152px */
}
.one-fourth {
width: 21.875%; /* 252px / 1152px */
}
.three-fourths {
width: 73.958333333%; /* 852px / 1152px */
}
.one-fifth {
width: 16.666666666%; /* 192px / 1152px */
}
.two-fifths {
width: 37.5%; /* 432px / 1152px */
}
.three-fifths {
width: 58.333333333%; /* 672px / 1152px */
}
.four-fifths {
width: 79.166666666%; /* 912px / 1152px */
}
.one-sixth {
width: 13.194444444%; /* 152px / 1152px */
}
.five-sixths {
width: 82.638888888%; /* 952px / 1152px */
}
.first {
margin-left: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment