Help with cross-browser compatibility!

[marknyc]

I'm using DreamWeaver to make a site for my choir, and I'm running into the same problems others have had regarding cross-browser compatibility of tables.

Since I don't have time to become a code expert, I imbedded a lot of the text in the background image to prevent it from shifting:

http://cantorinewyork.com/test/test12.html

So all I need now is to get the paragraph that begins "As we begin our 22nd season..." to be at the same height in all browsers. It's slightly different in IE v. Firefox, and very different on a mac.

Is there a simple solution to get just that one paragraph to stay put? I know the code is a mess, but I just don't have the time to make it perfect.

Thanks for any help!

Mark

P.S. The rollovers are not finished yet.

[Rincewind]

You are going the wrong route for x-browser compatability. The goal is not to have the page pixel perfect in every browser. Rather the goal is to have the page cope with changes from browse to browser without the layout breaking.

You shouldn't be asking how you make the text size fixed. But rather how to make your layout cope with the text size when it does change.

The solution is to just not use tables. If you put your image in. Then put the text in div's (Dreamweaver calles them layers) and position them over the images. This will keep the graphics separate form the text. So the text can alter in size without messing up the position of the images.

WRT messy code, you have to clean it up a bit. It doesn't take much time. Run the page through validator.w3.org and it will point out the problem parts. You will never acheive a cross browser design unless you keep your code clean.