It's official ... I do not like Utility Classes!

Just ranting here because Utility Classes have become the bane of my existence. When I first started using them I thought “Great! Just pop em in and keep on going!” Fast and Easy etc. etc.

Well I’m here to tell you that unless you have a photographic memory that allows you to remember exactly where you put which Utility Class … you may as well be writing inline styles!

I am now having to go through a complete project and pull them out and add them into my SCSS files because it is the most horrendous job to find which area of which page of which part of which element or it’s siblings/children are causing the issue.

O… M… G… I am so over them! LOL.

I have decided that Utility Classes have taken us back 20+ years to pre-css times. Back then Utility Classes would probably have been extremely helpful and useful, but now … all they do is cause me pain! :stuck_out_tongue:

end rant

I tend to use utility classes on commonly used (but not necessarily identical) components primarily for layout and positioning/spacing (ex.p-x, m-x, g-x) I find they’re especially handy when you want to change the spacing of elements depending on screen size (ex. pt-3 pt-md-4 pt-xl-5). What a pain it would be to have to write all that CSS and add media queries. They’re just quicker than writing CSS.

But, when I create something especially complex that I know I’ll reused on other sites, then I write custom CSS classes.

I think it’s just a matter of habits. There are dozens of utility classes I never use even though I probably could (should?), and there are a handful I use constantly. When you think about it, most of BSS’s visual interface is just applying utility classes to the components. In fact, it’s probably Bootstrap’s utility classes that made BSS a viable piece of software in the first place.

I keep this page bookmarked for quick review…


I don’t understand your problems, fr :skull:

Would the find and replace not help with that?

@floydmanfloyd no, the issue isn’t with finding and replacing, it’s with finding out which part of an element has “a” class on it. While i was learning all this (still am lol) I wasn’t real careful about where I put them as long as they worked … hence my frustrration now because I have to hunt and find what class was added to what element or part of the element. It’s just a rant, I’m sure I’ll get used to it, and was thinking already along the lines of only use for structure where it won’t need to change later. Anyways, it’s just a hunt and peck similar to if I had used inline styling and had to find what one a class was added to without knowing which class it was lol.

@dickykreedz And that’s my problem and that’s MY problem LOL.

@printninja Thanks for the resource I’ll give it a look and see if it helps me.

I Structure My CSS as Matthias Ott

no problem to find what I’m looking for


Thanks @kuligaposten I’ll look into that one too. Thanks guys for helping me get past the rant :heart: