-
1. Re: Linear Gradients CSS Formatting
Use this on-line gradient generator.
http://www.colorzilla.com/gradient-editor/
It will generate the code you need for various browsers (mozilla, webkit, opera, msie and filters for older IE).
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media Specialists
-
-
3. Re: Linear Gradients CSS Formatting
I used the Colorzilla code generator and it works fine. I pasted the code into my page. The individual background settings do not appear in my rules/properties (see the attached screen shot). How would I get them to appear there? Do I have to manually enter each one, or is there a simpler way?
-
4. Re: Linear Gradients CSS Formatting
When working with browser specific CSS, you have to do it in code view.
Technically speaking, browser specific CSS isn't valid code so it won't show in the CSS Panel.
Nancy O.
-
5. Re: Linear Gradients CSS Formatting
Nancy,
Is there a way to disable code in code view other than commenting it out?
-
6. Re: Linear Gradients CSS Formatting
You can delete it and use Ctl+Z to undo delete. That's about it.
Nancy O.
-
7. Re: Linear Gradients CSS Formatting
I tested the Colorzilla code on IE9 Windows and it does not render as a gradient. What is wrong? Here's the code it wrote:
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a7c5', endColorstr='#66a7c5',GradientType=0 ); /* IE6-9 */
-
8. Re: Linear Gradients CSS Formatting
Post the URL to your test page. It could be caused by an extra semi-colon but I can't tell without seeing everything.
Nancy O.
-
10. Re: Linear Gradients CSS Formatting
IE filters do not support multiple start and stop colors. You have the same hex #color in startColor and endColor. That's why you don't see a gradient in IE9.
Change this:
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a7c5', endColorstr='#66a7c5',GradientType=0 ); /* IE6-9 */
To this:
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a7c5', endColorstr='#92C3DA',GradientType=0 )
Nancy O.
