How to put a group layout settings into a class/style or to combine different styles?

Question
1

Hey folks! I am just getting started with Bubble coming from other editors, and while most things seems straight forward I can’t for the life of me figure out how Bubble handles classes/styles, and was hoping someone could point me in the right direction, as I can’t seems to find answers in styles documentation. I have two questions:

  1. How do I save for example a group’s layout settings such as “min-width” as a class/style, so I can apply it across multiple elements?

  2. How do I combine different stylings, normally done with CSS “helper” classes, for example one class dictating size and the other paddings of something?

Am I missing something obvious here, or does Bubble have entirely different logic/workflow to it compared to other editors/CSS?

2

  1. Element sizes aren’t saved as part of styles - you need to set the dimensions for each element when you create it

  2. You could create a different style for that, or manually override some part of the style in the Appearance settings of the element.

3

Thank you! So generally speaking, if I for example have a div with row layout containing 3 elements that I want to be 20% width, and 4 elements I want to be 10% width, I have no choice but to manually set width on each, which I need to manually update on each if I decide I want first 3 being different widths? There’s no more efficient workflow other than making each element into reusable component?