Website home page resolution issue

I have redesigned only the Home page using the DIV tags from Traditonal HTML tables, http://www.cricandcric.com

After that my page looks scattering across the screen, if the screen resolution increases. for the lower screen resolution its looking good, IE and Mozilla compatible

I am not able to make out the mistake which is done, can any one help me check this out.

Can any one share the resources if they on how to make the website which is developed using either HTML or IE more compatible with all VERSIONs of IE and Firefox, with all the different resolutions format, it should work fine, if any one has any good article share the link开发者_运维知识库 to me.

thanks in advance

your "middle1" section has a width defined as 1004px so should be almost the same size as the navigation, however the contents two tables and a div are positioned such that they dont float (certainly I cant see any floating in your CSS).

You're also using tables for layouts - i think thats the crux of the problem. Looks like you are trying to make a three column layout using CSS - have a look at this example: http://ago.tanfa.co.uk/css/layouts/css-3-column-layout-v1.html

I had similar problems for my website and it turned out that fixed width for div elements changed the rendering of the page depending on monitor resolution or screen size. I fixed the problem by using relative width by % instead of px for divs. It was a css issue.