How to Solve Unexpected Unit in CSS

It's always better to review the code you have written, wither take the help from fellow colleagues, another developer or even you can use automated code review like CodeFactor. One of the issue which will make your code look bad is to have Unexpected Unit (length-zero-no-unit).

According to CodeFactor (https://www.codefactor.io/), "Lengths refer to distance measurements. A length is a dimension, which is a number immediately followed by a unit identifier. However, for zero lengths the unit identifier is optional. The length units are: em, ex, ch, vw, vh, cm, mm, in, pt, pc, px, rem, vmin, and vmax."

That means if you are writing something like a { top: 0px; }, it is considered as a violation and thus it will give you a code-review issue as an Unexpected unit (length-zero-no-unit).

Solving this issue is not rocket science and it can be solved by the below method :

a { top: 0 } /* no unit */

Reference : https://stylelint.io/user-guide/rules/length-zero-no-unit