Hi there I’m using Vaadin 14 to create a grid contains cards like Vaadin Bakery application’s Storefront view does. I want to achieve each card could expand when click some button on the card.
I’m facing the problem is grid column/row position seems fixed, I did :host [part~="cell"] { height: auto; }
to make cell height dynamically change when click the card, but the expanded part will overlap the other columns since [part~="row"]
is absolute
.
I tried make row position unset by doing
:host #items [part~="row"]
{
position: unset;
}
however after setting this, columns will have huge gap between each other and I could locate this gap from where. I tried set negative value for margin-top
to move each columns up, seems doesn’t work well especially my card has different height.
Any ideas would be appreciate.
Thanks!