Div Problem

[SimsWorld]

Hi, This is my first time ever asking for help online, I'm 13 and for an I.T project we have to design a website, now I've already got one: http://www.simsworld.co.uk/ but since it was in quite a mess I'm re-updating it... I've already got the new template but unfortunatly it doesn't work on most screen resoloutions, I think this is because I've used percentages to align and size my div layers the one screen resoloution it does work on is (1024 x 768) ths is because I designed it using trial and error on my monitor but when I tested it on my laptop everything was squashed and nothing was where it should've been, they both have the same browser (IE 8) but just different screen resoloutions. I'm using notepad to code it and I have quite an advanced knowledge of html...
Ultimately what I'm trying to achieve is a website that resizes itself, in proportion to any screen resoloution so even if someone has a screen thats 30" wide and only 10" tall the logos and backgrounds wont be stretched unaturally, like locking the width and height.
Pease help

[X96 Web Design]

First rule of thumb - NEVER, EVER, EVEN THINK OF CODING IN IE. Internet Explorer (sorry for the term) Sucks. ;)

Get Firefox, and then test in IE.

As for the width... Can you post a link or something?

BTW - your website's broken in Firefox, Safari, Opera, etc. (http://x96webdesign.uuuq.com/xtra/sims.png)

And PLEASE never code to IE standards again! :)

// X96 \\

[SimsWorld]

Well that sucks :(

So you think I should completely redo the whole thing in firefox?
If so that sucks... and, well first of all thanks for the advice but christ I think I might aswell do this in freaking publisher or dreamweaver (I hate using programs) :( *sighs* Oh well... my I.T Teacher never actually marks our work (our class hasn't completed a single project ever) so I guess delays are allowed and inevitable but it still doesn't mean they're not F@£%! annoying... AAaaaa :mad:
thanks again and sorry I've not been on much but I guess I better get back to work :(

Oh and btw what did you mean by post a link (refering to the width)?

[euphoriastudio]

The issue you're gonna have with a "resizing" site is you need to use %s instead of px which can get frustrating. If its just a project for school, and it does not require it to self size, try aligning the site either to the left or center and fixing the size with px instead of %s. If your site is centered your main issue with it not aligning correctly is any div contained in another needs to use position:relative; that way it will be X distance from the edge of the div its contained in. position:absolute; aligns your div from the edges of the screen. :)

Another issue I see in your code is your #scroller div. IDs which are the "#" symbol, should be a div you that appears only once in the document such as a header. Classes which use "." can be used many times through out the page. This site explains them better http://www.tizag.com/cssT/cssid.php. Try creating a class div for formatting multiple things (color, font, border) and leave the #scroller div for aligning one thing (top, left, position).

Lastly I would recommend trying to code with out tables. Use css and divs to align your page rather than tables. But this is a personal preference and you may code as you wish. :) Good luck with your site!