Ability to style CSS Combinators: combo classes, pseudo classes, nested classes

When I add a css class and then add another css class on top of it, the resulting css rule in the code is a compound rule. Most of the time this is fine, but there are times I need the two rules to be separate. Please expand on the css layering, by giving us granular options for creating single-class or compound rules, and maybe even some complex bits like parent/sibling selectors, or ":" suffix rules.

Mainly, if I've got two elements, and one's got classes A->B->D while the other's got classes A->C->D, I don't want to have to define D twice, like I do now.

  • Brendan Keyworth
  • Sep 20 2017
  • Tyler Jensen commented
    January 15, 2018 17:52

    This feature would really help with designing with Webflow!

  • Kyle Craven commented
    April 5, 2018 14:48

    I wish we could style children of certain classes. For e.g. .main-navigation > li, rather than having to add a class on the li itself

  • Anna Timm commented
    April 10, 2018 09:20

    Yes. I like to use CSS in the "object oriented" style decribed here. And it's just barely possible in webflow to define "Button .red .greenBorder" and later reuse the border like "Image .greenBorder" in a simple way (as far as I know). This would also allows for better maintainance since one can simply change .greenBorder and it changes it on the Button and Image the same way...

    As a work around to the "A->B->D to A->C->D Problem" I make an empty throwaway-div with a "D" style, style it, and THEN add that "D" style to the elements. But that's a workflow that is needlessly complicated and prone to errors...

     

    This ties in to a lot of other ideas here like editing Styles/Classes/CSS directly from the Style Manager or re-ordering the Styles in the Style Manager or simply to copy/duplicating styles a bit more easily.

  • Luke Grayson commented
    April 19, 2018 05:02

    I justed started using WebFlow having come from a hand-coding background and I'm in disbelief that this feature doesn't exist.

    There is some really cool stuff in WebFlow, but the inability to style based on nested selectors is killing me. It may even end be a deal-breaker for me as the verbose HTML and CSS generated by having to give every single element a class or combination of classes is crazy.