Chromeのデベロッパーツールでinvalid property valueエラーが出た。これってなに？

Web制作でコードを書いてChromeのデベロッパーツールで確認すると、思っていた動作にならず。

該当箇所には、invalid property valueと表示されておりエラーを吐き出しているもよう。

調べてみると大したことはなかったのですが、次間違わないように備忘録として残しておきます。

invalid property valueエラーとは？

翻訳すると分かりやすいです。

invalid:無効な

property value: プロパティの値

どうやらプロパティの値の部分で何かミスをしているようです。

invalid property valueエラーの場合は大体は記述ミスであることが多いと思います。

よくあるのは全角のスペースを差し込んでしまっていたでしょうか。

私の場合は以下のようなコードでエラーが吐き出されていました。

.class {
    transition: all .8;
}

全角なんて入れてないのになぁ・・・と思っていましたが、秒指定のところでsの記述がなかったです。凡ミス。

正しくは、

.class { 
    transition: all .8s;
}

こうですね。

まさにプロパティの箇所で無効な値を設定してしまっていたわけです。

まとめ

invalid property valueエラーが出た場合は、全角か記述ミスを疑う。