1

This web page does not display correctly in firefox 3.6 /mac os.

http://solcuisine.com/dev/?page_id=2

.. and here's how it looks in firefox3.6/mac:

firefoxmac.png located in dev/ directory of same domain (sorry, can't post more than one link here)

http://solcuisine.com/dev/firefoxmac.png

The css has been validated in w3.org. And the page looks okay in firefox 3.6 in vista/xp, safari, chrome, ie8/7 and opera. Can't figure out what's the specific problem in css.

Any help would be appreciated.

Strelok
  • 50,229
  • 9
  • 102
  • 115
angelie
  • 11
  • 1

1 Answers1

2

Found the problem:

You need to turn off "overflow:auto" in #content .page (style.css line 295)

It looks like this right now:

#content .page {
    background:url("images/pagecontent-bg.png") repeat-x scroll center bottom #FFFFFF;
    overflow:auto; /*DELETE THIS LINE*/
    padding-bottom:50px;
}

Then you need to add a "clear break". If you don't have it already, create a style called clear:

 .clear { clear:both; }

Then insert the clear break after the end of your right column. Like so:

<div class="right">
    ...your right columns is here...
</div>
<br class="clear" />

That will fix it.

Andrew
  • 42,517
  • 51
  • 181
  • 281
  • Perfect! That has fixed the issue in mac. I used "overflow:auto" to keep the page's background image, didn't realize that it was actually the culprit. Thanks so much! – angelie Sep 19 '10 at 05:45
  • 1
    If that fixed it, would you mind checking the question as "answered"? Thanks!! – Andrew Sep 19 '10 at 13:12