border none: explanation about stylelint-config-sass-guidelines HOT 3 CLOSED

I believe this is why.

If you set a border-style to an element with border: none in a ruleset which selector has higher specificity, it overrides the fact that you set it to none. This breaks the open/closed principle .

from stylelint-config-sass-guidelines.

@sarahdayan I ended up publicly ranting about this issue on twitter where my conclusion similar to yours. It seems to lie within a use-case where, in the case of wanting to return border to an element, more work must be done with border: none than border-style: none or border-width: 0;

I think my chief complaint here is that in all of my investigation, this isn't explained. I think if this rule persists in the guidelines, it should have a proper error message that explains why.

from stylelint-config-sass-guidelines.

@paceaux This lint rule came from SCSS-Lint. From their docs, "border: 0 and border: none are fundamentally different, as they are both shorthands. The intent of this linter is to enforce consistency, rather than define which is "better.""

That's how I view this lint rule as well, it primarily drives consistency, but it also helps with some more nuanced use-cases around border styling. I don't really have a good answer beyond that but I really like demo and explanation with regards to the open/close principle from @sarahdayan.

I can updated the readme section on this rule to indicate that this rule is primarily about consistency.

from stylelint-config-sass-guidelines.