homepage Welcome to WebmasterWorld Guest from 54.166.113.249
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
CSS3 linear gradient syntax help
meek

5+ Year Member



 
Msg#: 4272261 posted 1:13 pm on Feb 25, 2011 (gmt 0)

Hi.

I'm trying to create a gradient background using CSS3 techniques.
I'd like to make a linear gradient from top to bottom, and go from transparent to #eee. However, I'm having trouble with the syntax.

This is what I have so far:

background: transparent; /* for non-css3 browsers */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#ffeeeeee'); /* for IE */
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, 0)), to(rgba(238, 238, 238, 1.0))); /* for webkit browsers */
background: -moz-linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(238, 238, 238, 1.0) 100%); /* for firefox 3.6+ */


Can anyone help?

 

SuzyUK

WebmasterWorld Senior Member suzyuk us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4272261 posted 3:51 pm on Feb 25, 2011 (gmt 0)

That seems OK to me, you just to need to add
zoom: 1; for IE<8 - zoom: 1; sets hasLayout to true, All filters need hasLayout to work in IE.

I just pasted your code, added it as background to a div#test, added zoom:1 just below the 1st background rule and it's working in IE, FF & Safari..

does that solve your issue or is there something else not working or problems in other browsers..

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