Regarding Bootstrap 5.1.3:
I want to hide elements on a page with bootstrap class ".invisible".
The problem is that bootstrap allocates space for this invisible elements which looks bad on the page.
When I set the elements to visible with class ".visible",the element should be added visible after the component before.
What is to do that bootstrap does not allocate space in page?
Use CSS for that. AndI think Bootstrap has also class "hiden" instead "invisible"
if you set bootstrap class .invisible it is equal to css syle "visibility: hidden". It will invisible but still on page as existing element.
if you set bootstrap class .hiden it is equal to css style "display: none" It will disapear element from your page as you expacting.
you can use bootstrap class or css styling
css styling:
.my-hiden-element {
display: none;
}
bootstrap:
<div class="hiden"><div>