-2

I have a problem with CSS3 gradients for IE11 i have something like this:

    .shine
{
    background: #222 -webkit-gradient(linear, left top, right top, from(#222), to(#222), color-stop(0.5, #fff)) 0 0 no-repeat;
    -webkit-background-size: 125px;
     color: rgba(255, 255, 255, 0.1);
    -webkit-background-clip: text;
    -webkit-animation-name: shine;
    -webkit-animation-duration: 4s;
    -webkit-animation-iteration-count: infinite;
}

And it's not working for IE11, can you help me with fixing this? I tried with CSS3 manual but still not correct.

hyperster666
  • 21
  • 5
  • 2
    Why would you expect `-webkit` prefixed styles to work with anything other than a WebKit-based browser? – T.J. Crowder May 03 '17 at 10:53
  • when i will delete this or duplicate like: .shine { background: #222 -webkit-gradient(linear, left top, right top, from(#222), to(#222), color-stop(0.5, #fff)) 0 0 no-repeat; background: #222 gradient(linear, left top, right top, from(#222), to(#222), color-stop(0.5, #fff)) 0 0 no-repeat; -webkit-background-size: 125px; color: rgba(255, 255, 255, 0.1); -webkit-background-clip: text; -webkit-animation-name: shine; -webkit-animation-duration: 4s; -webkit-animation-iteration-count: infinite; } Still not working – hyperster666 May 03 '17 at 10:53
  • Try this example: https://jsfiddle.net/jptm6sjd/ – Narxx May 03 '17 at 10:58

1 Answers1

0

First of all: don't try it all at once. Start small and upgrade further:

.shine {
  background-color: #222; /* For browsers that do not support gradients */
  background: linear-gradient(to top right, #222, #fff, #222);
}

Check out the W3Schools: CSS3 Gradients

Dimcho
  • 143
  • 3
  • 8
  • Still not working correctly, as you can see its shine animation for text but when I try to make it double without -webkit- and with it won't work in chrome too ;/ – hyperster666 May 03 '17 at 11:37
  • Could you describe in detail the final goal? Are you trying to add shine animation passing through your div? If so, check [Shine effect automatically with css](http://stackoverflow.com/a/34094733/1557451). – Dimcho May 03 '17 at 13:04