Skip to content

Instantly share code, notes, and snippets.

@leshido

leshido/baseline.css

Created Feb 22, 2017
Embed
What would you like to do?
A quick baseline grid overlay using css+svg. Inspired by [Basehold.it](https://basehold.it/).
/**
* A quick baseline grid overlay using css+svg.
* Inspired by [Basehold.it](https://basehold.it/).
* @author leshido
*/
body {
position: relative;
}
body::after {
/* Change the `height` parameter here to match your base line-height. */
background: url('data:image/svg+xml;utf8,<svg height="27" width="1" xmlns="http://www.w3.org/2000/svg"><rect width="1" height="0.5" style="fill:rgba(0, 255, 255, 0.3)" /></svg>') repeat top left;
content: "";
display: block;
pointer-events: none;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: 9999;
position: absolute;
}
body:active::after {
display: none;
}
@SarikaWirtz

This comment has been minimized.

Copy link

@SarikaWirtz SarikaWirtz commented Oct 10, 2018

its amazing ..

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.