Menu
I have a div with default display:none. how do I reserve the height so when the div shows, it does not reshift the elements around it? thanks
472
display:none removes the element from the document. It does not take up any space.
Unlike the visibility property, which leaves an element in normal document flow, display: none essentially removes the element completely from the document. The attached element does not take up any space, even though it's still in the source code. As far as the browser's concerned, the item is gone.
display: none doesn't have a literal opposite like visibility:hidden does. The visibility property decides whether an element is visible or not. It therefore has two states ( visible and hidden ), which are opposite to each other.
Display none don't reduce the size of the dom, just make the element not visible, like visible hidden, without occupies the visual space. Display none don't improve the performance because the goal of virtual scrolling is reduce the number of the elements into the dom.
Instead of putting display: none; on your div, put visibility: hidden;. It will be invisible, but still take up space.
88
Use visibility: hidden instead of display: none. Your element won't display, but its dimensions still apply and affect other elements because it's still a part of the page flow.
42
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
