homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

Help, please! gradient background, repeat-y, weird in IE
Other browsers render ok; IE places visible edge at end of gradient image

10+ Year Member

Msg#: 3445633 posted 2:38 pm on Sep 9, 2007 (gmt 0)

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?



5+ Year Member

Msg#: 3445633 posted 11:27 pm on Sep 9, 2007 (gmt 0)

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.


10+ Year Member

Msg#: 3445633 posted 11:44 pm on Sep 9, 2007 (gmt 0)

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

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved