The site info.nadv.ru has a scrolling block with position: sticky. The block scrolls under the block with cards (capabilities-container). This block with cards (Starts from the title "Features") has position: absolute.
The problem is that if the number of cards in an absolute block changes too, then the block height changes, and the block height (capabilities-list) in which the map (capabilites-map) is scrolled is not.
The number of cards in the absolute block varies depending on the position of the slider "for residents", "for business" (and the middle position is still, the code is in the body of the page).
Accordingly, if there are few cards, a bug appears - a container that is too large in height (capabilities-list {min-height: 4360px;}), whose height does not change at all, except in manual mode.
It is necessary to alter the layout somehow in order to preserve the functionality of the card scrolling under the block and in general, leave everything in place, but get rid of position: absolute so that the height of the .capabilities-list block changes depending on the number of cards in the "Capabilities" block ? (capabilities-container).
How can I do that? The project already has Jquery and Bootstrap, so if there is a solution using these tools, then fine.
PS or it can, like JavaScript, change the height of the block depending on the number of cards in the "Features" ...
