CODEWITHSUNDEEP
htmlcssbackground-image
user1584751
user1584751

Reputation:

body image to stay against main container

I would like to add a background-image (circles in image below) to the body of a website i am working on, I need the image to stay flush against the container(white center with green and red banners in image below) so that even when the browser is maximized or minimized the image will stay flush to the container.

I'm not sure if i'm am saying this correctly so i've placed a visual as reference (below) along with my CSS code(below). 

html, body{height: 100%;}

body{ 
    background: #e5e5e5 url('../img/body_bck_lrg.gif') no-repeat -290px 190px fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    /*background-size: contain;
    background-origin: border-box;*/
   }

visual reference of background-image and container area of website

Upvotes: 0

Views: 268

Answers (1)

Tzanis
Tzanis

Reputation: 21

Try this:

body{ 
    background: #e5e5e5 url('../img/body_bck_lrg.gif') center top no-repeat;
}

This should stick the background to the center top of the screen and will fill with #e5e5e5 for the rest of the space if screen resolution it too big.

Upvotes: 2

Related Questions