Menu
I'd like to make some empty hidden elements (iframes would be nice, paragraphs would do) that Javascript would later fill and modify. I have not been able to figure out how to keep these elements from taking up space. I've turned off margins and padding and set height to zero but still end up with blank space.
I'd like to see an example of an hidden element that takes no space on the page. Actually, I'd like to see the HTML, CSS, and Javascript. :-).
474
Look, instead of using visibility: hidden; use display: none; . The first option will hide but still takes space and the second option will hide and doesn't take any space.
visibility:hidden hides the element, but it still takes up space in the layout. display:none removes the element from the document. It does not take up any space.
visibility: hidden means it will be hidden, BUT will remain in the flow of the website. Essentially, visibility: hidden will not show the element, but will retain the space it takes up. Whereas display: none completely removes it.
The visibility CSS property shows or hides an element without changing the layout of a document.
If you're using visibility: hidden; you should be using display: none; instead.
107
I assume you are using visibility: hidden? As you have seen, this will hide it, but will still take up space.
However, using display: none will hide it and remove it from the page layout.
34
#myelement { display:none; } should already do it via CSS, using <div id="myelement"></div>
1
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
