Jump to content

Content Not Centered, Why?


Recommended Posts

Hi everybody,


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




This one does appear centered with every screen resolution:




What is the difference?


I would really welcome your help.


Thanks a lot in advance,



Link to comment
Share on other sites

Short course in css centering.



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

body { text-align:center;}

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


Use the calculated brute-force method:

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



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.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Unfortunately, your content contains terms that we do not allow. Please edit your content to remove the highlighted words below.
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...