Welcome to WebmasterWorld Guest from 23.22.46.195

Forum Moderators: not2easy

Help, please! gradient background, repeat-y, weird in IE

Other browsers render ok; IE places visible edge at end of gradient image

   
2:38 pm on Sep 9, 2007 (gmt 0)

10+ Year Member



I thought it was a color-rendering problem, at first, so I tried it with "web-safe" colors; no help.

I've tried this on <div>, and alternately on <body>. Same result.

I have a small (31px high by 200px wide) gradient image, one edge of which is the same color as the background. I use it on one side of the involved area, e.g. background-position: right top ...then produce edge via background-repeat: repeat-y;

The other browsers behave properly. IE7 places an obvious edge along the image...where it's supposed to flow into the area background.

Is it, simply, my (png) image creation skills?

11:27 pm on Sep 9, 2007 (gmt 0)

5+ Year Member



Does your png contain any transparent areas?

I know that IE6 does not handle png transparency properly. It would fill in any transparent areas with a purplish color. Not sure about IE7 though.

11:44 pm on Sep 9, 2007 (gmt 0)

10+ Year Member



No transparency whatsoever...the part of the gradient projecting within the div (or body) is precisely the same color as the background-color defined for the area...weird, huh?

In my own website, it is particularly visible because the divs involved are #666, but I got curious and went to a client's website I had written in a similar manner, in a much brigter color (in the neighborhood of #cfc) and though it was bright enough to disguise it to a "casual" glance, one could detect it upon careful inspection...

 

Featured Threads

My Threads

Hot Threads This Week

Hot Threads This Month