test background grid

by bakhshi

HTML

<div>
</div>

CSS

div{
    width:100px;
    height:100px;
    background-image: 
        -webkit-linear-gradient(blue, transparent 1px),
        -webkit-linear-gradient(180deg, blue, transparent 1px),
        -webkit-linear-gradient(270deg, blue, transparent 1px),
        -webkit-linear-gradient(90deg, blue, transparent 1px);
    background-image: 
        -moz-linear-gradient(blue, transparent 1px),
        -moz-linear-gradient(180deg, blue, transparent 1px),
        -moz-linear-gradient(270deg, blue, transparent 1px),
        -moz-linear-gradient(90deg, blue, transparent 1px);
    background-image: 
        -o-linear-gradient(blue, transparent 1px),
        -o-linear-gradient(180deg, blue, transparent 1px),
        -o-linear-gradient(270deg, blue, transparent 1px),
        -o-linear-gradient(90deg, blue, transparent 1px);
    background-image: 
        -ms-linear-gradient(blue, transparent 1px),
        -ms-linear-gradient(180deg, blue, transparent 1px),
        -ms-linear-gradient(270deg, blue, transparent 1px),
        -ms-linear-gradient(90deg, blue, transparent 1px);
    background-image: 
        linear-gradient(180deg, green 1px, transparent 1px),
        linear-gradient(270deg, red 1px, transparent 1px);
    background-position: -1px -1px, 1px 1px, -1px -1px, 1px 1px;
    -webkit-background-size: 20px;
    background-size: 20px;
    
    
    -webkit-transform: scale(10);
    -moz-transform: scale(10);
    -ms-transform: scale(10);
    -o-transform: scale(10);
    transform: scale(10);

    -webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    -ms-transform-origin: top left;
    -o-transform-origin: top left;
    transform-origin: top left;
}