What did I do wrong?

[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.

[kuroi]

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.

Glad the Peekaboo reference helped. You may find it helpful to note that although there are a number of suggested fixes when you following that link, I've never yet seen one in Zen Cart that couldn't be fixed simply by removing unnecessary background colors (i.e. where background colors have been added to layers sitting on top of layers that already have that background color).

In respect of your "same problem" - please could you be a little more specific. Unless you are working with a Zen Cart version 1.3.0 - 1.3.0.2, it's unlikely that you have exactly the same problem as the original poster, and it's not clear what part needing centerColumn to fit your design contributes to it.

[tehbulats]

i'm sorry for lack of details.. hehe, anyway i am using the purpleshade template V1.3. and installed the latest version of Zen.,

i have the same problem with hareslade.. using IE.. i found out that i need to scroll up my browser to show up my product description and IE can't render the text properly, same as the peekaboo bug..