0

I'm creating some transition in my stylesheet, and I have this css, but when I validate it here, I get warnings concerning the syntax.

The css is this:

a:after {
    content: '';
    height: 2px;
    margin: 0 auto;
    display: block;
    position: relative;
    background: #b8d5e5;
    opacity: 0;
    transition: opacity .25s, -webkit-transform .25s;
    transition: opacity .25s, transform .25s;
    -webkit-transform: translateY(10px);
    -ms-transform: translateY(10px);
    transform: translateY(10px);
}
a:hover:after {
    opacity: 1;
    transition: opacity .25s, -webkit-transform .25s;
    transition: opacity .25s, transform .25s;
    -webkit-transform: translateY(2px);
    -ms-transform: translateY(2px);
    transform: translateY(2px);
}

JsFiddle here.

It seems to work fine - at least in Chrome, but what do I need to change in order to fix the syntax?

Meek
  • 3,086
  • 9
  • 38
  • 64
  • 2
    These warnings just tell you the validator doesn't understand browser-prefixes. Nothing to worry about. – Luuuud Oct 22 '15 at 08:58

1 Answers1

3

They're just vendor prefix warnings. You can ignore them.

See also: How to validate vendor prefixes in CSS like -webkit- and -moz-?

Community
  • 1
  • 1
BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
  • yes if animations works in chrome and it is, then put -moz-transofmr and you can give -o- and -ms- also and will be ok, same goes for transition -webkit-transition eitc – Szymon Oct 22 '15 at 09:01
  • @Szymon Dziewoński: No, absolutely nothing needs to be changed about the given CSS. Transitions in particular are a mess and what the OP has is the bare minimum that's needed (plus -ms-transform). See http://stackoverflow.com/questions/29806730/what-is-the-right-combination-of-prefixes-for-css-transitions-and-transforms?nah=29807157#29807157 – BoltClock Oct 22 '15 at 09:02
  • @BoltClock I cant agree with you http://www.w3schools.com/css/css3_transitions.asp you need prefixes in transitions too. If he wants to this working on each browser he need to put prefixes – Szymon Oct 22 '15 at 09:14
  • @Szymon Dziewoński: I may be biased but I don't know if I should feel insulted that you think *W3Schools* of all places is more reliable than Stack Overflow. – BoltClock Oct 22 '15 at 09:17