954,180 Members — Technology Publication meets Social Media
Username:
Password:
Lost login information?
Have something to say? Contribute New Article Reply to this Article

Centering Websites

What code do I need to use so that when someone goes to my site, it will be centered on their screen no matter what their screen resolution happens to be (sort of like this website...where there is blue along each side)?

Also, where would that code need to go?

Thanks!

mcinteractive
Newbie Poster
1 post since Aug 2005
Reputation Points: 10
Solved Threads: 0
 

Well first off you would need to make your tables or divs in %'s and not actual pixel .

so

<center>
<table width="100%"> 
</center>


and NOT

<center>
<table width="550"> 
</center>

100% will use entire width of screen... not sure if thats what you want.. but by using %'s you will adjust to the users res.

techniner
Posting Pro
527 posts since May 2005
Reputation Points: 12
Solved Threads: 19
 

With CSS, you set the margin of your main content block element to "auto", and it will automatically center, even if the content itself is given a width.

If your main content is contained in a div, you might give that div the class "container", and your CSS declaration might look like:

#container
  { position: relative;
    width: 656px;
    background: #ccc;
    border: 15px solid #666;
    margin: 0 auto;
    padding-bottom: 5px;
  }


The margin says, make the top/bottom "0", and make the sides "automatic".

tgreer
Made Her Cry
Team Colleague
2,118 posts since Dec 2004
Reputation Points: 227
Solved Threads: 37
 

I dont understand this, The problem i am having is as stated, I downloaded a phpBB2 Forum theme, But the content, Images etc are all crammed into the left of the page. Is there anyway to make it centered on the page ? as said before like this site if you didnt have the blue navigation bar.

I have no idea where to start, The main problem isnt really the code, it is what page to start on, But if someone could answer both code and what page it would be great, if you can only answer one still answer i need all the help i can get thx

** EDIT **

Sorry i forgot to add that i know the problem is with the screen resolution, I run at 1024x768 and it is crammed to the left, but when i put my res to 800x600 it is centered and takes up the page. And btw ALL tables in every page is set to 100% in the width.

PLEASE HELP, I have been up for ages trying to get this working, :cry:

sinister747
Newbie Poster
14 posts since Aug 2005
Reputation Points: 10
Solved Threads: 0
 

You never said before, that you were working with PHPBB. If you don't understand the CSS suggestion I made, and don't know how to work with PHPBB's templating, then I suggest your best place to get help would be the phpbb site itself.

tgreer
Made Her Cry
Team Colleague
2,118 posts since Dec 2004
Reputation Points: 227
Solved Threads: 37
 

headache free method;

put your site between the tags. Make sure the tag is outside of this.

Jared

php4ever
Junior Poster in Training
68 posts since Feb 2005
Reputation Points: 10
Solved Threads: 0
 

That doesn't validate in strict XHTML, for example. The proper way to achieve centering is as I explained in my prior post. Use CSS margin for block-level elements. For inline elements, you can use text-align.

tgreer
Made Her Cry
Team Colleague
2,118 posts since Dec 2004
Reputation Points: 227
Solved Threads: 37
 

like strictXHTML should be avoided as I understand it but you are in fact 100% correct about the validation. I just tested it because you had me curious.

I make my previous statement based on an article I read at CSSCreator.com

Thanks sincerely for that XHTML tip on validation. I didnt know that.
Jared

php4ever
Junior Poster in Training
68 posts since Feb 2005
Reputation Points: 10
Solved Threads: 0
 

Jared,

No problem. I don't agree to avoid strict doctypes. In fact, I often code strict XHTML. It minimizies cross-browser issues. In fact, you should start with the strictest doctype, then if, and only if, you absolutey need some tag or property not in the strict doctype, should you seek an alternative.

For example, on some sites I use XHTML Transitional, only because I want to use the "target='_blank'" property in my hyperlinks.

tgreer
Made Her Cry
Team Colleague
2,118 posts since Dec 2004
Reputation Points: 227
Solved Threads: 37
 

Hey thanks tgreer, sure that makes sense;

I myself usually avoid it not because I want my code less strict but I too find that many of the CMS and Open-Source applications I build templates for actually work better with either transitional or simple HTML 4.0

You might find that article at CSSCreator of particular interest. I know it was well thought out and pretty informative. In fact anyone really looking for some good info on can read some nice details here.

http://csscreator.com/css-forum/ftopic11242.html

I hope this helps

Jared

php4ever
Junior Poster in Training
68 posts since Feb 2005
Reputation Points: 10
Solved Threads: 0
 

I'm sure we'll talk further. I'm investigating CMS systems for a site I run. I'd welcome any advice you have, though I'll start another thread in a relevant forum when the time comes.

tgreer
Made Her Cry
Team Colleague
2,118 posts since Dec 2004
Reputation Points: 227
Solved Threads: 37
 

This article has been dead for over three months

Post: Markdown Syntax: Formatting Help
You
View similar articles that have also been tagged: