Open In App

SASS | Relational Operators

Improve
Improve
Like Article
Like
Save
Share
Report

Relational operators are those which compare the values of two numbers. They tell whether one number is smaller or greater than or equal to the other number. They automatically convert numbers into compatible units.

  • <expression> < <expression> returns whether the first expression’s value is less than the second’s.
  • <expression> <= <expression> returns whether the first expression’s value is less than or equal to the second’s.
  • <expression> > <expression> returns whether the first expression’s value is greater than to the second’s.
  • <expression> >= <expression>, returns whether the first expression’s value is greater than or equal to the second’s.

Example:




@debug 100 > 50 


Output:

true




@debug 10px > 17px 


Output:

false




@debug 96px >= 1in  


Output:

true




@debug 1001ms <= 1


Output:

false

Numbers without units can be compared with any number. These unitless numbers are automatically converted to the other number’s unit.

Example:




@debug 100 > 50px 


Output:

true




@debug 10px > 17  


Output:

false

Only the numbers with incompatible units cannot be compared to each other.

Example:




@debug 100px > 10s


Output:

Error: Incompatible units px and s.


Last Updated : 28 May, 2020
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads