Vaadin 23 - CSS Remove theme="padding spacing"

Flow
1

Hello,

I’m currently upgrading a Vaadin 14 app to 23, as a stepping stone to 24.

Functionally it has been udpated and is working as expected.
However I am seeing some different behaviour for the rendering on the screen.
Mostly extra padding and spacing that is throwing out Vertical and Horoizontal layouts.

The CSS and the HTML produced are the same comparing old to new, but for some reason, the theme=“padding spacing” is now causing issues.
If I manually go in (with developer tools in Chrome) and remove the 'theme=“padding spacing” declaration on the ‘vaadin-vertical-layout’ or ‘vaadin-horizontal-layout’ in question it all looks closer to how it used to look.

I can’t find though how to get rid of the theme programatically.

Setting padding and spacing to false on the component in java code wasn’t doing it.

Does anyone know how to just get rid of that ‘theme’ being applied?

Thanks.

2

setSpacing(false);
setPadding(false);

Should do it, I’ve never heard that those methods do not work. Are you sure you applying it to the correct elements?

3

Thanks for responding to my query.
You know, I had been making those changes, but getting back into it this morning, I found some additional layouts in the heirarchy to specify the explicit handling of spacing and padding on to correct things.

1 Like