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?


Recommended Answers

All 10 Replies

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


<table width="100%"> 

and NOT

<table width="550"> 

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.

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:

  { 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".

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:

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.

headache free method;

<div align="center"></div>

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


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.

<doctypes> 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.


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.

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 <doctype> can read some nice details here.


I hope this helps


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.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.