Hi,
again, a styling question.
I want to make items in a MultiSelectListBox more compact. I was hoping for a ThemeVariant or setPadding or something like that, but didn’t find any, so back to CSS. I tried to set padding of the vaadin-item to 0, but this doesn’t seem to have any effect.
Please advise. :)
It’s a bit unintuitive, but for the vaadin-item there is also a min-height, that has to be overridden, parallel to the padding.
This for instance will compact it as much as possible. You can then play around with the min-height or padding.
vaadin-item {
padding: 0;
min-height: 0;
}
On the left you will still have the checkmark placeholder, even if no items are checked. If you do not want to use the checkmark at all, you can hide it. Then the padding will affect all sides more or less equally.
vaadin-item::part(checkmark) {
display: none;
}
(https://vaadin.com/docs/latest/components/list-box/styling)
Great, thanks a lot!