DEV Community

[Comment from a deleted post]
Collapse
 
alohci profile image
Nicholas Stimpson • Edited

Some good points there. In the case of "font-family:inherit" on a button element though, I think it makes sense to use rather than a variable, because what you're really saying is you want the button to be the same font as its surrounding text, whatever that is. So if refactoring and removing the parent changes the surrounding text's font, then you'd want the button to adapt automatically to that, which is what inherit would do.

I'm also not personally a fan of BEM, which is a massively verbose way to write markup. You don't have to use long selectors without it. It's very rare that well written complex selectors need more than three compound terms. And even with BEM, you still can't avoid complex selectors completely.

Collapse
 
sargalias profile image
Spyros Argalias • Edited

Thanks for your reply.

Fair enough about the button. In the end we can do anything we want. We just need to be careful that it's not unexpected and causes bugs and difficulty in the future. So absolutely, using font-family: inherit; could be acceptable, as long as the team is happy with the pros and cons.

Fair enough about BEM too. I use BEM personally but what I really mean is having a reasonable architecture where CSS specificity doesn't eventually become unmaintainable. If you can reasonably achieve that without BEM then you've achieved the main goal of BEM anyway (in my opinion) :).

The reason why I personally prefer BEM is because it absolutely minimises specificity even when you need complex selectors. I know from personal experience that having to work with a specificity of 10 is much nicer than having to override a specificity of 20, even for small things.