Help centering website

lason

New Member
Hi everyone. I recently had someone help me make a simple 4 page website. Everything is up and running however the page is aligned to the left and I can't figure out for the life of me how to center it. I tried contacting the person who helped me but I can't reach him. I've been trying my hand at this all day and I can't figure it out. Can someone please help? Thanks in advance.
 

lason

New Member
I should have mentioned, I'm very much a newb at web design. That's why I had someone help me.
 

Phreaddee

Super Moderator
Staff member
add this to your html
HTML:
<body>
<div id=“wrapper“>
...rest of page content
</div>
</body>
... And your css
Code:
#wrapper {
Margin: 0 auto;
Width: 960px; /* make this the width of your site */
}
 

lason

New Member
add this to your html
HTML:
<body>
<div id=“wrapper“>
...rest of page content
</div>
</body>
... And your css
Code:
#wrapper {
Margin: 0 auto;
Width: 960px; /* make this the width of your site */
}

I added that but nothing changed.
 

Phreaddee

Super Moderator
Staff member
Well its difficult to check your site without a link, or your code, but if that doesnt work, it probably is made with absolute positioned divs... Please post your code. Or a link.
 

d a v e

New Member
that is designed to be a left-aligned site though - it also stands out because it *is* left-aligned rather than the 'standard' centred so i wonder whether you should try and centre it - how is your background image going to work then?

also the text is too small and the layout doesn't expand when you resize it (the text) - i'm sure the type in your books isn't set so small ;)
 

Janja

New Member
Like mentioned above, you will have to put a wrapper around your content and give it a position of relative with the width and margins like they said.
If it still doesn't work in IE you wil have to give the body tag a text-align center. You can then change the text-align to left for the wrapper again. Sometimes IE needs that.

I agree, your text is too small. I would probably also increase the line-height on the text. Ususally on the web, you would use a non-serif font... it's more readable.

I think, if you repeat a sliver of your background to go all the way, it would still look nice.
 

PixelPusher

Super Moderator
Staff member
Like mentioned above, you will have to put a wrapper around your content and give it a position of relative with the width and margins like they said.
If it still doesn't work in IE you wil have to give the body tag a text-align center. You can then change the text-align to left for the wrapper again. Sometimes IE needs that.

I agree, your text is too small. I would probably also increase the line-height on the text. Ususally on the web, you would use a non-serif font... it's more readable.

I think, if you repeat a sliver of your background to go all the way, it would still look nice.

No need to add the position property unless there are absolute positioned children. Static position will be just fine. There is also no need to use the text align property on the body for IE. If written correctly, all browsers will adhere to the the auto value for left and right margins providing the same element has a defined width.
 

JNsites

New Member
On the body tag <body> add the following <body style="margin: auto;"> the inline style will over ride anything in the style sheet and align the site in the center.
 
Top