Prefer logical properties over physical properties.
Logical properties are a set of CSS properties that map to their physical counterparts. They are designed to make it easier to create styles that work in both left-to-right and right-to-left languages. Logical properties are useful for creating styles that are more flexible and easier to maintain.
This rule checks for the use of physical properties and suggests using their logical counterparts instead.
Examples of incorrect code for this rule:
/* incorrect use of physical properties */
a {
margin-left: 10px;
}
Examples of correct code for this rule:
a {
margin-inline-start: 10px;
}
This rule accepts an option object with the following properties:
allowProperties
(default:[]
) - Specify an array of physical properties that are allowed to be used.allowUnits
(default:[]
) - Specify an array of physical units that are allowed to be used.
If you aren't concerned with the use of logical properties, then you can safely disable this rule.