Streaming live at 10am (PST)

Any way to style a unique element? (no class / automatic combo class)


#1

USE CASE: I’m hoping to use a page of our site as a template for cloned pages. This page includes a kit full of design options for various case studies and pitch pages. We want to be able to clone this page, and edit elements within the cloned page freely WITHOUT cascading those changes back to the original page.

The only way to do this seems to be to create a combo class each time we adjust an element’s style on a cloned page. This is super time-consuming. Is there no way to break an element “free” of its class? To assign an item “no” class? Or to add a combo class automatically when adjusting style?

It seems impossible. We want to use a template page, but riff on its style. Typing in Combo classes for every style change is laborious!


Here is my site Read-Only: https://preview.webflow.com/preview/fancyrhinostaging?utm_source=fancyrhinostaging&preview=5a455654964f11c128fac5a5a8ef0170

The Page I’m trying to use as a “template” is called “Build Me A World.”


#2

You can duplicate the classes to isolate them from the source but thats just as time consuming as a combo class. You can also do the opposite which would be to apply a combo class to the source page overriding all parameters and then remove that combo class on the copy as to not affect each other. Unfortunately thats all I got other than custom code options which I can’t really help with.


#3

Thanks DFink. Would be great if Webflow allowed us to leave some elements without a class if we so chose, since flexible design is the name of the game. Having to assign a class to every element all the time seems a little…legalistic!! Would think WF could auto-assign a combo class for new styles if we wanted.

But thanks for your thoughts – I’ll probably have to use another tool for custom template pages!


#4

Well having to assign a class to style an element is the way CSS works. That part is in no way a Webflow limitation, thats the foundation of how web design styling works. As it is now, if you create a new element and change a parameter, it auto creates a style for it. It doesn’t add a combo class once the first class is created when you modify something because generally you’d be modifying that existing class even if you were a developer, instead of creating a new one.

One thing you may not know but is very useful is that you can create multiple global classes and apply them to a single element instead of doing isolated combo glasses.

An example would be if you had a text style and then you had another global style that makes text green. You can apply that green global style to the text to override the parameters while the original class can still control everything that isn’t being overridden.

I made a short video for this to show how it works. Pretty cool CSS feature.