What did I do wrong?

[harmeet]

Hi all

I downloaded the Zen Cart 1.3 and applied two mods -

Dual Pricing Mod, and
Froogle Feed Generator

I also made some changes to the css files -

classic/css/stylesheet_original.css, and
classic/css/stylesheet_new.css

All along I was using Firefox. There was no problem. Now I am testing with IE for those who prefer IE. But the main page text does not show up on load. If you select or scroll, it shows up. So, it needs a refresh.

Any ideas what I may have done wrong?

By the way, my site is - www.mobile4u.ca

Thanks

Harmeet

[harmeet]

I just downloaded IE 7.0 and it looks great in IE 7.0! Anybody experienced similar problem? If yes, how did you resolve it?

Please help me if you can. It will save me a lot of time.

Thanks

[kuroi]

Congratulations. This is easily the most difficult CSS question that I have seen asked on these pages. I spent a very frustrating day tracking down a solution myself three weeks ago, and thought at the time that sooner or later this would drive somebody else crazy.

What did I do wrong

You did nothing wrong (at least nothing relevant to this problem which I believe to be a variant of the IE6 Peekaboo bug (note: the example at the end of this link only works properly(!) if you visit using IE).

In summary, it is believed that under certain circumstances involving touching divs one of which contains plain text, the background color of the div containing the text can erroneously move to the forground. So the text is still there and if you scroll off the page and back, or drag your cursor over it, it will re-appear.

The link given above offers an array of possible workarounds, many with side effects. However, I found many of them already implemented in the 1.3 stylesheet or ineffective, but happily I think my relatively simple solution should work for you too.

In essense, since this appears to be a problem with the background color moving to the foreground, I'd remove the background color from the class centerColumn and any other classes or IDs inside the indexDefault div. I'd then make these areas appear white again by changing the background-color of mainWrapper (which is currently a pale blue that is obscured by the divs sitting inside it) to white.

Fingers crossed, please let me know how you get on.

[harmeet]

Thanks a lot Kuroi! You saved me!

[hareslade]

I had similar, the category text kept peek-a-booing in IE6.

If the background of the main page area is white, one can just remove the 'background' line altogether in the centercolumn entry in the template css file -- then the text area gets a white background, without having to specify it at all in centercolumn..

Its definately just the local 'div' background colour layer that jumps on top of the text that is inside the div's area.

[tehbulats]

oh god.. after a long time reading i found this thread.. i have the same problem here.. but i need my "centerColumn" to fit my design.. any ideas guys?

Thanks for the IE6 Peekaboo bug links.. this is very useful.