Welcome to WebmasterWorld Guest from

Forum Moderators: open

Message Too Old, No Replies

trouble centering tables on different monitors

i'm a web design noob :)



8:26 pm on Nov 14, 2007 (gmt 0)

5+ Year Member

I am so glad I found this forum. I am a TOTAL newbie when it comes to web design, but I started 2 months ago and built my site using Yahoo sitebuilder. I loved it and everything looked great - Then I bought Page Publisher and had to teach myself how to enter the WYSIWYG tags so I could do daily updates - This weekend I went to my dad's house and looked at my site on his 22" monitor and was astonished at how terrible it looked - On my 19" monitor at work it's looks okay and my 17" at home it looks fine but on the bigger monitors the pages go to crap - So I started looking at my HTML coding and realized that all my tables are set Absolutely (example: div id="e17" style="position:absolute;left:121;top:450;width:150;height:30;"> -

SO, I want my tables to be centered on any size monitor, but I am guessing I need to keep the table position set at Top450 and the width locked, etc. The Divide ID tags I really don't know what they are, but everytime I mess with one it really screws up the page -

I looked at some advice and found ALIGN="CENTER" - Can I just enter this tag someowhere in my HTML and have the tables center the screen, w/out really screwing up the layout? I also read about using %'s and something like 100% will keep margins perfect - Is this an attribute I can just add to my table? I'm guessing there is a simple fix, but I don't have a clue what it is - would appreciate some help - Thanks

Here is a table example of my HTML page (I know this is probably real! ugly) if that helps -

<div id="e2" style="position:absolute;left:31;top:195;width:930;height:210;">
<table border="0" cellspacing="0" cellpadding="0" width="930">
<td nowrap height="210"></td>

[edited by: pageoneresults at 8:42 pm (utc) on Nov. 14, 2007]
[edit reason] Removed Specifics - Please Refer to TOS [/edit]


5:09 pm on Nov 26, 2007 (gmt 0)

5+ Year Member

It looks like the absolute positioning is messing up your attempt to center the table. In the div style, try using the following code

<div style="margin-left: auto; margin-right:auto;" >

Setting the left and right margins to auto will center the div for you. If the div is inside another container though (can't tell from your code sample) it will only center it within that container, not in relation to the entire page. So if you want to center a table instead of a div, you could insert the same style attributes into your opening table tag... Hope this helps!



Featured Threads

Hot Threads This Week

Hot Threads This Month