0
#toggle div:hover {
     background: rgba(0,0,0,0.2);
    -webkit-box-shadow:inset 0 -1px rgba(0,0,0,0);
    -moz-box-shadow:inset 0 -1px rgba(0,0,0,0);
     box-shadow:inset 0 -1px rgba(0,0,0,0);
     color: #fff;
}

Above is the css block I am using on Mozilla, and gives me Unknown property '-moz-box-shadow'. Declaration dropped. warning.
And the jquery I am using is 1.7.2 version and also tried with 1.9.1 same warnings.
I fear that these warnings is restricting my css to work fully.

Nakilon
  • 34,866
  • 14
  • 107
  • 142
Prachi
  • 3
  • 2
  • `-moz-box-shadow` is an old workaround You must to use `box-shadow` for all modern browsers. However, it doesn't works because you miss some parameters. `box-shadow: [xcoord] [ycoord] [width] [blur] [color]`. You only put the two firsts parameters, so if the box shadow have no width it doesnt show. – Marcos Pérez Gude Mar 10 '16 at 16:32
  • What does jQuery have to do with any of this? – BoltClock Mar 10 '16 at 16:34
  • I have read some answers saying that these warnings does not come with 1.7.2 and are there with 1.9.1. So, omitting those replies/answers. – Prachi Mar 10 '16 at 17:06
  • http://www.w3schools.com/cssref/css3_pr_box-shadow.asp , check this @MarcosPérezGude those properties are optional. – Prachi Mar 10 '16 at 17:10
  • @MarcosPérezGude The shadows as written don't show because their alpha channel is maxed at 0 (aka fully transparent). OP should really use `transparent` instead as it's less locs than `rgba(0,0,0,0)` by 2 and a little more clear. As for why he's doing it, I'd assume he animates it to a non-transparent color elsewhere; having a shadow already on the item makes the animation less jerky. – abluejelly Mar 10 '16 at 17:51

1 Answers1

2

It has nothing to do with restrictions, but only with the fact that browser prefixes are not recognized by W3C. Your code will work well, even if you'll see these warning during validation.

Check this answer.

Bruno Kos
  • 645
  • 2
  • 8
  • 18