Cross browser support - only IE works atm

I created this site, Retina-FX, based off some sketches I did at first. I made the layout fairly quickly, and then spent a while (understatement! :P ) making the content. I finally thought I was finished with the whole thing, when I suddenly realised that it looks awful when viewed in netscape or mozilla.

I can understand why quite a bit of the css won't work, and also why my iframes don't work - but I am not too sure why the actual table layout changes so drastically on other browsers. If anyone could point me in the right direction towards sorting this I will be very grateful!

I was also considering the idea of leaving it alone and just placing "requires internet explorer 5.0 or higher" somewhere, maybe on a splash page. What are your opinions on doing this?

You are right, looks really bad in Mozilla

You have got to take into account 2 things:

1: Statistics show that 95% of browsers are using IE 5 and above
2: Never trust statistics.

HTH

Haha, I think I understand what you're saying.

Anyway, I guess I should do something about this pretty soon then. Hmm.....if I can detect their browser in php, then I should perhaps only view the current code when it is IE 5.0 or above. Does anyone know an alternative to using iframes that will help me to fix this problem? Please don't tell me I have to build the iframes into the outer layout's script, because I want this to be done before christmas (christmas 2004 that is ).

Any help/useful links would be great!

It works pretty well in my mozilla, it looks terrible in IE5 that is the only IE I have.
The only problem in Mozilla is your 8ball graphic is being repeated but only half of it is showing the second time.

luck,
robert

After giving this some thought, I have decided that it would be best to make a different version in a layout that will work on any browser. The current one should still be visible for users with Internet Explorer (only 6.0 or higher by the sound of it ), otherwise they will be redirected to the other layout.

I have 2 domains for this site that both use the same hosting. I was wondering if I could detect whether a user has gone to .net or .com and show the different layouts for each one. How could I go about doing this?

Check out $_SERVER variables, as I see you have PHP on your site.

It may also be possible to use get_browser() to detect the browser, but not all hosts allow this.

HTH

Ah thanks for that jabba. I searched for that function and found a very useful script that I can include that will spit out a variable containing their browser information.

I will start making the layout for mozilla/netscape users soon, I was just wondering what are the do's and don'ts of coding for these browsers. I already know a lot of css isn't supported, but how are tables treated differently on those browsers compared to IE?

I think if you want to go for layout for all browsers, use @import for the css - that way bowsers that don't support it will get a basic layout with no css.
Alternatively have seperate stylesheets for the main browsers.
One thing is that I would do your testing in non IE. You will probably find that it will be OK in IE, but try browsers that are the most standards compliant, as browsers are all improving and moving towards these standards if they are not these already.
Some useful information can be found at WaSP .

Thanks again jabba, you've been really helpful

I found out that for some reason, netscape (and probably many other browsers) doesnt support tables very well. It said that tables should be made using HTML 3.2, not HTML 4.0. I am not familiar with the differences here, but I'll just test in netscape from now on and hope it works.