canonical / vanilla-framework

From community websites to web applications, this CSS framework will help you achieve a consistent look and feel.
https://vanillaframework.io
GNU Lesser General Public License v3.0
832 stars 164 forks source link

Dividers in equal heights component don't work well when items are hidden on smaller screens #5062

Closed bartaz closed 5 months ago

bartaz commented 5 months ago

When equal height component is used with has-3rd-divider and we use u-hide--medium to hide one of the column items, the divider appears on medium screen below last item:

image (1)

It's caused by the fact that we are expecting to have 3 elements in right column (but we only have 2 - with one of those hidden).

The dividers being tied up to the container element and grid position, they can't be automatically aware if any items are hidden on small screens.

We need to find a solution to allow flexible adding dividers on specific breakpoints.

bartaz commented 5 months ago

In Jira as: https://warthogs.atlassian.net/browse/WD-10920