CODEWITHSUNDEEP
htmlcss
Jc23
Jc23

Reputation: 3

how can i set a fixed background and scroll in css?

how can i set a fixed background and scroll in css??? and also ive been trying to set a background to cover all dimensions by i always end up with a blurry background :(

im relatively new at this so please dont judge me, this is my css: body #bg { width: 100%; height: 100%; position: absolute; left: 0px; top: 0px; z-index: 0; background-attachment:fixed;
}

.stretch
{
width:100%;
height:100%;
background-attachment:fixed;
}

Upvotes: 1

Views: 111

Answers (1)

Nico O
Nico O

Reputation: 14152

Like this:

This oe is fixed, set body to 100% to make full screen: http://jsfiddle.net/X8Z2v/4/

This one is scrolling by: http://jsfiddle.net/X8Z2v/5/ 

 html, body {
        height:3000px;
        margin:0;
        padding:0;
    }
    .stretch {
        position: absolute;
        left:0;
        right:0;
        top:0;
        bottom:0;
        background-image: url(http://www.placehold.it/2000x1000);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
        background-attachment: scroll;
    }

HTML

<div class="stretch"></div>

Upvotes: 1

Related Questions