I've been diving into html/css over the past few weeks and am now trying to optimize my code with the DRY principle (along with SMACSS/OOCSS/BEM). I believe I have a decent understanding of it all, but there's one thing that's still unclear to me.

Should the DRY principle be applied 100% of the time? Let's say, for example, you have 'text-transform: uppercase;' being applied to two different classes. According to the DRY principle, you'd remove the rule set from each individual class and place it under a comma-separated list of both classes. But after awhile, doesn't this make your stylesheet a complete mess, where every class is being declared multiple times on the same sheet? Or does it really not matter what your sheet looks like, since you could simply search for "uppercase" in the search box if any future changes were needed?

It seems that you wouldn't be getting any performance improvements out of this scenario. Yes, you'd be removing one property from your sheet, but you'd also be adding an entirely new rule set and repeating the class name.

I understand it could be done either way depending on preference and each project, but I'm more concerned with what might be the most efficient way (especially when it comes to building large, complex sites). I'd like to stay consistent throughout all of my projects moving forward.

Are there any sort of guidelines to go off of? For example, maybe only combining duplicate code if the amount of properties you're removing is greater than X? Or only combining duplicate code when they're related semantically?