7 Replies Latest reply: Apr 19, 2009 1:18 PM by iBod
foxofinfinety Level 1 (35 points)
hello I have this in a page:
-webkit-gradient(linear, left top, right bottom, from(#ffffff), to(#6375D6));

and it doesn't work....
I really have no Idea what's wrong
I have the safari 4 ^Beta^ so it should work

none it's actually just a motherboard... almost everything is build in!, Windows XP Pro, ReactOS is also installed, but used rarely as it's still alpha...
  • iBod Level 7 (29,340 points)

    What's the page in question?
    If you can't link to the site, can you post a test case page over at http://pastebin.com
  • foxofinfinety Level 1 (35 points)
    actually it's a CSS class
    putting it on pastebin isn't going to make a difference I think,
    as the complete CSS class only has this and a height and width and
    the page only the required tags (html, head, body) and a div
  • iBod Level 7 (29,340 points)
    Ok, your decision, but it's pretty tricky to debug someones code without seeing the actual code.

    The CSS gradient examples I've seen over on the webkit website work fine in Safari 4 on Windows for me, so I can only assume it's your code that is the issue.
  • foxofinfinety Level 1 (35 points)
    I mean there is not much more code
    I've put it there but I don't think it will help:
    [PHP/XHTML|http://pastebin.com/m75fc13a9] [CSS|http://pastebin.com/d7bca171f]
  • iBod Level 7 (29,340 points)
    It did help

    You have the definition in the CSS file set incorrectly.

    -web-gradient is not a CSS property, but rather a value a property can have.

    In your example, try adding background before the gradient definition in the CategoryTitle class.

    background: -webkit-gradient(linear, left top, right bottom, from(#ffffff), to(#6375D6));
  • foxofinfinety Level 1 (35 points)

    but I also need to use a gradient on a HR
    to make the it change collor from left to right, and also the opacity
    has to change from 1.0 to 0.0
    I really don't know how to do that
    I have this:
    background: -webkit-gradient(linear, left top, right bottom, from(opacity:1.0), to(opacity:0.0));

    but that doesn't work (I assumed that in the first place, but doesn't hurt to try)
  • iBod Level 7 (29,340 points)
    Try something like this instead:

    background-image: -webkit-gradient(linear, left top, right bottom, from(rgba(255,0,0,1.0)), to(rgba(255,0,0,0.0)));