How to center background in css?

[Cainnech]

Hi all,

I've got a question concerning CSS.

I'm creating a page but I want to keep my background centered. I created a big background of 1920x1080 px which is being used as background of a div.

So I want to center the div depending on the screensize of the visitor.

How do I go about on this one because I can't get it to work.

Thanks

[drhowarddrfine]

Generally, just adding 'margin: 0 auto' will do it but depends on the rest of the markup.

[Cainnech]

Never mind, got it!

In my case where my background is 1920x1080 it results in this:

#container
{
position: absolute;
width: 1920px;
height: 1080px;
background-image: url('images/bg.jpg');
background-repeat: no-repeat;
margin-top: -540px; <!-- = 1080/2 -->
margin-left: -960px; <!-- = 1920/2 -->
top: 50%;
left: 50%;
}
 

Greets,
Cainnech

[drhowarddrfine]

Yes. That is why you must post your complete markup. Using 'position:absolute' changes everything.

[Bharat383]

background-image:url('images/img2.jpg') center;


or
background-position:center;

Bharat Parmar(Bharat383)