Relume Community Icon

Home

Announcements
Figma Support
General
Showcase
Webflow Support

Powered by Tightknit

Confusion Over Padding-Section-X Classes in Relume Components | Relume Community

Confusion Over Padding-Section-X Classes in Relume Components

·

·

I'm reading through CF docs and see that they suggest using padding-section-x classes to the div with padding-global added. In Relume components it's added to a separate div, why is that?

Loading attachments

6 comments

· Sorted by Oldest

Miguel
·
·
hi... if you do that, you'll be adding extra padding on both sides. the way i do it is like this:
Loading attachments
Miguel
·
·
I’m trying it your way, but it’s doing the same thing. I’m not a fan of adding combo classes... I feel like it gives me less control.
Miguel
·
·
One div manages width and side padding, while the inner one handles vertical spacing. Having a separate padding-section-x wrapper makes it easier to adjust vertical spacing for different screen sizes or layouts without affecting global width.
Miguel
·
·
Both approaches are valid though. Relume separates padding-global (horizontal padding) and padding-section-[x] (vertical padding) into different divs so each one can be controlled independently. At least that's how I see it.
Emily M.
·
·
Yes, generally the Client-First approach seems to prioritise independent control, which is why I found it interesting they would say otherwise in their docs. The rationale is that using combo classes avoids excessive nesting. I assume CF accepts the Relume page structure in their certification process? Matt J.
Matt J.
·
·
This was a newer improvement introduced after the majority of the components were already built and I think new components follow it to be consistent with older components. At one point it was suggested to be an optional improvement but dont quote me on it. That would be my assumption as well Emily M.