Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I am experiencing an issue with CSS3 gradients within a backend i am developing.
Firefox is rendering the gradient fine, but Safari creates strange extra lines of the same colour withing the gradient.
See the images for comparison.
Safari / Firefox
Can anyone point me to a cause? Would be great! Thank you, guys.
The colors used do not have enough contrast. What you’re seeing is a browser implementation of what to do when there is not enough color depth supported. Safari takes an approach where it “guesses” what the intermittent, unsupported colors are, making what appear to be lines. Firefox takes another approach. It uses what’s called dithering, where it takes a bit of one color and speckles it over the other color to give the appearance of gradation where there isn’t enough contrast.
Possible solutions are increase the contrast or make a gradient in Photoshop or whatnot and apply the dithering manually.