I am taking my first crack at a table-less design and I'm trying to rebuild a photography portfolio page with css. Unfortunately, I'm having some serious cross-browser issues with several areas on the page. I was hoping someone could look at my code and tell me if there is something I should change. The page is available here or if it's preferred I can post the code.
Problem 1 - I had a 3 column, 4 row table that holds thumbnail images and, with the help of some code from allistapart.com, I've got it looking pretty good in IE6 and Mozilla Firebird for Windows. But in Netscape 6 and Opera 5.1 the thumbnails don't display properly at all. Also, in IE6 there is some extra space under the thumbnails that doesn't appear in Mozilla.
Problem 2 - The main image that is swapped when you click on a thumbnail is overlapping the bottom of its container in IE6 and the top in Opera, but looks perfect in Mozilla and Netscape. The images and the containers are all set to 300px high.
Problem 3 - I have an 11px copyright statement at the bottom of the page and I want it vertically centered in the 20px high div, but I just can't get it to do this in IE6 or Netscape, even though it looks fine in Mozilla, and not bad in Opera.
I hope this isn't too much to ask, but I would really appreciate some help or else I may just have to stick with my tables.