Adding a new padding-[size] class

Client-First
1

In one of my projects there was a need to add a new padding size (in this case it was .padding-xxxlarge).

I noticed that this new padding overrode left-right 0rem from .padding-vertical.

Of course, all other paddings work fine and Global Styles were not changed.

Should I modify anything else to make it works?

2

I’ve noticed that the order in CSS sheet (looking at a browser’s console) is different between current styles and added ones.

@Support-Luis any idea why this is happening?

Zrzut ekranu 2023-09-29 o 16.41.36
Zrzut ekranu 2023-09-29 o 16.41.36492×538 31.4 KB

Zrzut ekranu 2023-09-29 o 16.41.52
Zrzut ekranu 2023-09-29 o 16.41.52490×546 31.6 KB

3

Hi @filip.radkiewicz !

Please, could you share your project read-only link? We will check for you, thanks!

4

Sure: Webflow - Calamari

5

@evekayser any idea?

6

Hi @filip.radkiewicz ! We are still checking with the team. Sorry for the late response.

For now, I would suggest you to use one of the padding-customs we have, like padding-custom1. You can update the padding sizes and rename padding-custom1 to padding-xxxlarge if you want.

Thanks for bringing this up :pray:

1 Like
7

@filip.radkiewicz Hi, actually the recommended approach is to use the CSS Style Reorder from Finsweet Extension.

You can check in this video below:

Thanks :wink:

2 Likes
8

Woow! That’s awesome. Everything’s is clear now :slight_smile:

Thanks a lot!