Hello everyone!
I have a problem with global classes and wanted to ask for help.
In the Designer I have created few global classes for basic styling eg. text-uppercase, text-red, font-bold.
Now let say that I have applied two or more global classes to the specific element, let it be: text-uppercase text-red
Later I decided that the element shouldn’t use uppercase style, so I want to delete text-uppercase. Unfortunately I can’t, the option is not available in the dropdown:
Sadly I can only delete last class applied to the element.
I tried clicking 2 selectors and from dropdown select class text-uppercase, in that case I’m able to remove the mentioned class:
Unfortunately there’s a side effect, if I delete this class, then the Selector field is empty. There’s no text-red class visible:
but the class styles are still applied to the element:
Is there a workaround for this problem? How I can manage remaining global classes?
Otherwise I don’t see too much sense in using global classes, if I can’t add/remove them when necessary.
Sadly, no. What you have discovered is that global combo classes are not a substitute for utility classes. They really are just combo classes–each one is nested inside the one above it. They’re Webflow’s way of shoehorning the obvious/painful need for at least some degree of utility classes into their combo class framework.
The best you can do is this: Make a stylesheet page where you define every class you want to use this way independently as one-off classes. Then for any object in the site you can add one or more in the form of global combo classes. However, if you want to remove one, you’ll need to delete them all and re-add the rest. Also note that if you want to edit one, you’ll need to edit them in the stylesheet, since any edits you do to them when they are in combo class form won’t fully percolate out to all the other places you use them (only to places where they are used in the same combo class order).
Finally, from experience I might recommend applying global classes to an object BEFORE any local class you want to make for it, not after (i.e. make the local class as a combo class of the last global class you apply). Otherwise you’ll drive yourself crazy by accidentally editing the last global class when you meant to edit the local class, thereby affecting everywhere else in your site where that global class happens to be used in the same combo class order. The side effect of this recommendation is that if you want to change which global classes are applied to an object, you may have to remake the local class (since it’s only defined as nested in a global class).
Basically, it’s a mess and Webflow doesn’t support utility classes. Global combo classes are little more than a hack to partially get by without losing your mind.
