centering of content (css)

Question

I just can't seem to figure this out - I'm trying to get the top section (class=top) to center regardless of screen resolution.

Can anyone offer any advice please?

EDIT: hahah sorry! I completly forgot the link!! :)

• linked removed

Thanks,

Michael

Answer 1

It slightly depends on your site structure, but if you mean horizontal centering setting a horizontal margin of auto should work.

margin: auto; /* will set vertical margin as well, but this won't have an effect */

If you are talking about vertical centering it's a lot more complicated:

http://blog.themeforest.net/tutorials/vertical-centering-with-css/

Edit: you added a link to your site

In your specific case, setting the margin of .top to auto won't cut it because of two reasons:

1. .top has a width of 100% because it's a block-level element.
2. .top needs this width of 100% because of the background color

To fix this, add another div within .top, give this div a fixed width that is wide enough to contain all the content (it seems you need 1124px) and give this div the margin:auto.

Answer 2

You forgot to link your website but if you're trying to center a div inside its parent horazontally you can use this:

.top{ margin:0 auto; }

<div class="top">content</div>

Answer 3

Set the css margin attribute..

margin: 0 auto;