CSS Specificity is the set of the rules applied to CSS selectors in order to determine which style is applied to an element. The more specific a CS...
For further actions, you may consider blocking this person and/or reporting abuse
This was a super cool read! Especially the calculation at the end – that was definitely something I knew would work, but never knew why. Thanks for a great explanation.
Also, I love the effort you put into your section headers, etc. The yellow is really lovely, and that attention to visual detail isn't something you see a lot in other blogs :)
Hi, Emma!
Thank you for this great article, it helped me greatly;
Look at the screenshoot, it seems to me it doesn't work properly;
Because:
Check this 😉
You're right, it should be:
Otherwise, excellent article!
I think you are right. I found that strange too.
Cool article, thanks Emma!
Didn't know there was a formula to calculate specificity nor tools to aid. They might be handy when you're trying to debug :)
Bootstrap is the main reason we use !important :D Fortunately I see less and less Bootstrap around.
Personally I'm a big fan of Bootstrap 4 grid, since they use flexbox.
But regarding the Bootstrap overrides, don't override it with !important.
Customise it by overriding the sass variables instead of styles for every component. A good example is bootswatch.com.
This is the most succinct article I have ever seen on specificity. I love the use of graphics for calculating specificity. Excellent job!
Nice article!
Quick check ;-)
muki.tw/wordpress/wp-content/uploa...
I think using !important is always ALWAYS a bed practice.
Sometimes you have no other choince but at least try before.
I messed up one of my mock interviews because I did not knew about CSS specificity. But this article has made me clear about what CSS specificity is and how does it work. This article is truly a GEM 💎💖
Thank you so much for writing this. Please share more resources where I can learn about this. :)
Great article,
Emma u are a star .
Thank you very much for this article!
I knew that “CSS specificity” was a thing but I never knew that there was such a (mathematically) simple calculation rule.
Nice work Emma. This is the kind of content i want to see on dev.to. 👍🏻
Thank you!
I posted this in tonight's DevDiscuss on Twitter, but thought it would be helpful to leave this in the comments of your post as well.
Thanks, Emma. It was so nice to read it.
The Star Wars one cracks me up. I saw it again for the first time in a while a couple of weeks ago and was 😂.
Thanks that was the most clear explanation of CSS specificity I have come through.
I didn't know about specifity in CSS, It was nice to learned it in such a practical and math-fun way, thank you Emma!
Thanks for showing us how CSS specificity work. You describe it in a very simple way.
Thank you Emma for this resource. I go bad and reread every few months.
I knew about this already, but it's nice to have something to reference anyway, especially when it's this short and sweet.
Thank you for sharing such a wonderful post :)
Really awesome read. I've spent hours before now trying to override styles in WordPress templates (made by other people) and it's been brutal.
The best kind of article! Thank you for the clear explanation!
Those headers are nice. How did you make them?
Thank you for this article, was so great!! I'll start using the four-category system.
This is such an amazing explanation!!
Thanks a lot!
This is an awesome read! I found out something new and logical.
Thanks for the effort!
Love it. Great article!
thanks Emma :D
Decided to finally look up what the !important value was all about after I came across it now in bootstrap's source CSS, couldn't have been explained easier, thank you.
Hello Emma !
this is a great article. I was seeking article on specificity like this. I know
what to do now !
Thanks.
great post Emma.