Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Elliott Frazier
Courses Plus Student 9,647 PointsI need guideance with adding a gradient in a SVG image
I made a icon that had gradients in Adobe Illustrator, then I saved it as a SVG image, I put it on my site i'm working on, it looked fine in google crome but when I viewed it in FireFox I noticed that none of the gradients displayed because AI didn't include the vendor prefixes and I have no idea how to do it. I have already watched the CSS videos about grads and i'm still stuck.
hopefully Guil Hernandez and/or Mat Helme can help
4 Answers
Guil Hernandez
Treehouse TeacherHi Elliot,
Like lloan alas said, you'll need to place the <defs> outside of <symbol> in order to see it in Firefox.
I adjusted it for you and it now looks good in Firefox. Take a look.
lloan alas
17,774 PointsYou have to move the gradient def. outside of the symbol element. Try that. It's a bug on Firefox.
Elliott Frazier
Courses Plus Student 9,647 PointsThanks Guys!