I’d consider this a bug as padding-block and padding-inline are pretty universal now?
This goes alongside my Wishlist ticket for universal padding options, but if I manually edit the stylesheet for an element using padding-block or padding-inline, those values do not properly get interpreted into the frontend of the Builder as their respective “top/bottom” and “left/right” values.
In this example, padding-top and padding-bottom are manually set to 2em, and then padding-block overrides those with 1em, as it’s the last rule:
However, the frontend grabs and fills in the top and bottom values, missing the valid block rule and confuses the user, because the padding is actually set to 1em 0 but appears to be 2em 0 in the Builder:
Fix would be to look for padding-block and padding-inline, and if present, apply those to the builder, only falling back to padding-top etc if those are not present.
@Pakic No worries man, same! I started seeing these properties pop up in some of the code reviews at my job, and they’re really useful shorthand. It’s kinda like flex: 1 0 auto shorthand.
I tried making support for this, but its not a task that can be done quickly, so I will postpone this.
Issue is that padding-inline-start doesnt work same as padding-left for example, and I need to check if website is RTL, and there are issues with what happens if you add both padding-left & padding-inline start. So yea, its much harder than it looks to support this and I guess very low amount of people will even try to do this, so we will make support for this in next re-coding/redesign of design tab, should happen this year
But what I have fixed now is if you type padding or margin, we automatically split that in 4 values (top, right, bottom, left) so it works with designer correctly.
