Uneven columns and browser/resolution difficulties

[pmrozik]

Hello All!

I'm new here and I'd like a little bit of help with something I can't quite solve by myself. I recently created a website for my dad's business and then I decided that I would like to become a web designer, but there's a lot of work ahead of me and I came across a few problems.

The website: www.meneo.pl

There's no English version, but code is what's important I suppose.

Most of my inspiration came from Eric Meyer's CSS book and everything in his book is based on remaking an existing website which is usually written in pure HTML. Therefore, I use tables because I no of no other way to use CSS without tables.

The problem:

There are three columns on the site. The one on the left with the menu works fine when the resolution is set to 1024x768 and when the browser is IE or Opera, but it doesn't work under Firefox. If the resolution is lower than 1024x768 then the menu on the left side becomes misaligned.

I attempted to solve the problem by setting the width of the menu cell to 130px because that's the size of the logo in the cell just above. So both were set to 130px, but the problem still appeared in Firefox. I'm quite new at this so any insight as to how to make the columns even under every resolution and the three most popular browsers would be appreciated. Most of my visitors use IE and their resolution is set to 1024x768, but I need to know the details as I'm still learning.

Thanks in advance.

Pawel

[gizmo]

Pawel, Have you done a search of these forums, this topic has been covered so many times before ?

[Fang]

The learning curve for css layout can be stee, but you will reap the rewards later.
Google for the basic layout you require or get 1 built here (http://www.csscreator.com/version2/pagelayout.php)
If you must use tables for layout, you only need one.
<table border="1" cellpadding="0" cellspacing="0" summary="">
<tbody>
<tr><td colspan="3">header</td></tr>
<tr><td>menu</td><td>content</td><td>images</td></tr>
<tr><td colspan="3">footer</td></tr>
</tbody>
</table>
That's your basic layout with a table.

The h1 element should only be used once on each page and does not need a br element in it. Use css padding.

[pmrozik]

Thank you very much for your help, Fang. I feel a little disappointed now because I've been reading Eric Meyer's book on CSS and everything is based on tables.

Gizmo - I haven't a chance to search through the forums, but I'll do so next time.


Once again thanks for your help.

Pawel