Firefox and IE displays page differently

[Camelot]

Can someone please check out this page with IE and Firefox. www.3dwebbooks.com In IE it looks fine, but in Firefox the midsection is pushed down below the menu on the left side. Does anyone know what causes this. This is driving me nuts. Love CSS driven websites but sometimes..grrrr.

Tom

[jsoul4life]

In my opinion, i prefer to use firefox over IE but thats only because IE is made by Microsoft. Lol . The IE/Firefox problem that you are having occurs due to the way that the webpage browser encrpts the CSS code. For example, i could have a webpage made in CSS which works perfectly in Firefox and it would work like crap in IE. In order to fix such layout problem, what developers use different CSS code with special symbols inco-operated with the CSS file in order to fix the problem.
HERE IS AN EXAMPLE:
html>body #coolmenu a{ /*Non IE rule*/
width: auto;

[Kravvitz]

Part of the problem on that is the clear:both on #advert-right. They coded for IE/Win instead of coding for more standards compliant browsers like Firefox, Opera, and Safari.

IE7 supports the ">" combinator, so it will apply rules like that.

[Camelot]

Thanks for the replies. So is there something I can do to fix this? This is my first page using no tables so I'm not very good at this. Any help is appreciated. Should I change all the floats to fixed or absolute positions?

tom

[drhowarddrfine]

Don't have time to look at the code but, no, just make your code work in Firefox so you know your code is correct. Then we can help you adjust for old, buggy non-compliant IE.

[Camelot]

This is driving me crazy. Tried everything to make it look ok in Firefox but can't do it unless I make everything absolute.

Any suggestions?

tom

[Tyssen]

Part of your problem is that #navBar and #advert-right should be in the same containing element and that element should be floated rather than applying the style to each bit individually.

[drhowarddrfine]

To start with, remove the clears from nav and advert-right divs. By clearing, you are saying you don't want any other floats sitting next to them. This is why your advert is not sitting where it should.

[Camelot]

dr: I did remove the clears and that really messed up the page. The content element moved down and the advert_right moved up next to the advert div Man.. this designing without tables is fun.

Tyssen: how to I best put them in the same element? Can I wrap them in a new div tag?

I had hoped I could correct this in the style sheet so I did not have to edit every page...guess that's not possible.

tom

[Tyssen]

Tyssen: how to I best put them in the same element? Can I wrap them in a new div tag?

You've got a three column layout so you should have three main content containers - everything else should go inside one of those.