CodePen

HTML

            
              <body>
  Hello World
</body>
            
          
!

CSS

            
              @mixin gridoverlay($gridsize, $gridwidth: 100%,$gridcolor: #00FFFF, $gridthickness: 1px)
{
	&:before {
		content:"";
		position:fixed;
		z-index:1;
		top:0;
		right:0;
		bottom:0;
		left:0;
		margin: 0px auto;
		width: $gridwidth;
		opacity:.3;
		pointer-events:none;
		z-index: 10000;
		background-image: -webkit-linear-gradient(90deg, $gridcolor $gridthickness, transparent $gridthickness, transparent), -webkit-linear-gradient(0deg, $gridcolor $gridthickness, transparent $gridthickness, transparent), -webkit-linear-gradient(90deg, transparent 100%, $gridcolor 100%), -webkit-linear-gradient(0deg, transparent 100%, $gridcolor 100%);
		
		-webkit-background-size: $gridsize $gridsize;
		-moz-background-size: $gridsize $gridsize;
		background-size: $gridsize $gridsize;

	}
	
	* {
	  -webkit-user-modify: read-write;
	  word-wrap: break-word;
	  -webkit-nbsp-mode: space;
	  -webkit-line-break: after-white-space;
	}
	
	a {
	  -webkit-user-modify: initial;
	}
}

body
{
    @include gridoverlay(10px);
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................