Content Not Centered, Why?

[ivanmax]

Hi everybody,

 

Could anybody tell me why this page doesn´t appear centered with every screen resolution (please don´t mind the broken images)?

 

http://www.artepolaroid.com/principal_uno_...Untitled-4.html

 

This one does appear centered with every screen resolution:

 

http://www.artepolaroid.com/principal_uno_images/cara.html

 

What is the difference?

 

I would really welcome your help.

 

Thanks a lot in advance,

 

Iván

[btrfld]

Short course in css centering.

 

Horizontal:

Make the containing element center-aligned and use the 'auto' feature:

body { text-align:center;}

#Layer1 { width: 720px; margin: 0 auto; }

OR

Use the calculated brute-force method:

#Layer1 { width: 720px; position: absolute; left: 50%; margin-left: -360px; }

 

Vertical

The brute-force method is the only one I know:

#Layer1 { height: 800px; position: absolute; top: 50%; margin-top: -400px; }

 

The brute-force method has the possible problem that if the width or height of the div is larger than the screen, the div may disappear behind the left or top edge.

 

In your pages it seems that you are using the brute-force method and you need to recalculate your negative margins.

 

Hope this helps a little.

[ivanmax]

Thanks a lot.

 

I will try that tomorrow morning.

 

Always great to come here.

 

 

Iván