Small changes to the CSS

Things I’d like to see in the handling of CSS styles

  1. Ability to delete any style
    (currently some styles can not be deleted, frustrates me having to manually search for and delete)

  2. Create styles without an element
    (just have a button on the css tab to create a new style, now I create a block just to do this)

  3. Edit / remove nested styles
    (possibility to nest or take out the nested, my biggest problem is when creating a style on an element that already has one, It always creates a nested and often I do not want it.)

  4. not sure if that would bring problems for the current format, but it would be cool to edit the base elements of a css (like: a, img, etc)

by the way: webflow rules!

taking advantage of the topic, it would be nice to delete colors from the color pallet.

and could also have the option to expand and contract items in the Navigator tab (F), for a better view.

=D

Thanks for the feedback @lucaspchara! A lot of these things we would love to implement. It will just take some time.

Ability to delete any style

Currently you can delete unused styles. That means styles that aren’t linked to an element on any page. It would be cool to delete it and auto-unlink that class from that element.

Create styles without an element

What’s the purpose for creating styles that aren’t connected to an element? I’m interested.

(possibility to nest or take out the nested, my biggest problem is when creating a style on an element that already has one, It always creates a nested and often I do not want it.)

When you type in your class in the selector field in the top right corner you will see if the class you’re creating is “nested” or “global”. The best way to create a global class is to drag in a block or another element and create a class for it. Then you can actually apply that global class to any selector (even nested selectors). Note: It will only show up when you click to edit the selector.

not sure if that would bring problems for the current format, but it
would be cool to edit the base elements of a css (like: a, img, etc)

We’re working on this and other types of selectors.

it would be nice to delete colors from the color pallet.

You’re talking about swatches right? Totally! This was our rough v1 release. In our next release we want to make the whole swatches management more robust.

expand and contract items in the Navigator tab (F)

Totally! We want to build this in. Just has been on the backburner while we’re building other features.

Create styles without an element

What’s the purpose for creating styles that aren’t connected to an
element? I’m interested.

In my head, when I create a site, I already have several styles in mind, usually styles that will use several times on the site (border, a text color, shadow effect, etc.), it would be easier for me to create everything from once, or create in a way that I do not need an element to do this.
Currently I create a block just to create global css styles that I use several times, I just think it would be more practical to create directly in the CSS tab.
made any sense what I said? =P

I imagine that you guys should already have a lot of ideas on the list, I’m looking forward to see the webflow grow, has been a very useful tool for me and my company. and congratulations for the quick replies to the forum. cheers!

1 Like

Completely agree with @lucaspchara on

Ability to delete any style

There are several styles that are listed as being used, but I can never find. Would love to have the ability to trash a used style. Would be a big time saver.

It would be nice if you had some sort of calendar or list of ideas in progress. So we could see what you already have in mind and when they would be ready. (not necessarily need to have dates, but only a list of items that are being worked on)

I just came across a scenerio of this. Lets say I’m using some jQuery to target a particular class i want to switch a style to, this would be perfect. Or simply inline your CSS. Am I making any sense here?

Yes exactly, for example applying the class .active to an element can change display:none to display:block but maybe in design mode that class isn’t applied to any elements yet because the script applies it on a DOM event.

1 Like

I’m new to Webflow, and am liking it, but have to agree that the class creation process seems backwards. In general, the CSS implementation does not seem consistent with how CSS is supposed to work.

  1. When creating a website, I am used to creating a set of CSS classes first, then applying them elements as I create them. This way I can mix various classed on the same object. In Webflow, I am very confused as to what applying a second class actually does. I rather create a class, like “font-dark” first, then be able to apply that to any element that already has a class.

  2. I have been unable to set the base font, and when my site loads, it flickers from the base Webflow font to the font I have set. How can I fix that?

  3. I have found that classes set at the body level override more specific classes, which is not how cascading was designed to work. Not really sure what is allowing that to happen, haven’t had time to investigate yet.

Thanks,
John

3 Likes