Skip to content

Instantly share code, notes, and snippets.

@MikeAM
Last active December 15, 2015 00:18
Show Gist options
  • Save MikeAM/5171527 to your computer and use it in GitHub Desktop.
Save MikeAM/5171527 to your computer and use it in GitHub Desktop.
/* CSS gradient backgrounds that generate a Baseline Grid */
/* by: Mike Morrison, Soholaunch.com */
/* You don't have to leave this credit comment in, but it would be nice of you. */
/* Based on a 16col/22px baseline grid with 960px overall width */
.baseline-grid {
background-image: -webkit-linear-gradient(0deg, rgba(200,0,0,.2) 40px, transparent 40px),
-webkit-linear-gradient(top, rgba(0,0,0,0) 95%, rgba(56,255,255,.8) 100%);
background-image: -moz-linear-gradient(0deg, rgba(200,0,0,.2) 40px, transparent 40px),
-moz-linear-gradient(top, rgba(0,0,0,0) 95%, rgba(56,255,255,.8) 100%);
background-image: -o-linear-gradient(0deg, rgba(200,0,0,.2) 40px, transparent 40px),
-o-linear-gradient(top, rgba(0,0,0,0) 95%, rgba(56,255,255,.8) 100%);
background-size: 60px 100%, 100% 22px;
background-position: 10px 0px;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment