Menu
I've set up all my navigation for my website as hide.show divs (using behaviours). It all works pretty well, but I've now realised the problem of the divs taking up space even when they're hidden, extending the height of my wrapper far too much.
I really want the height to extend and contract according to the amount of content on display.
http://shanuea.lockernerd.co.uk/camel/
The divs are absolutely positioned and set to visibility:hidden. Any help appreciated, please let me know if you need more info.
530
If you want to make something invisible, and also not take up any space, You can also use the CSS display property. And unlike visibility: hidden, an element hidden with display: none won't take up any space on the page.
Answer: Use the CSS display Property You can simply use the CSS display property with the value inline-block to make a <div> not larger than its contents (i.e. only expand to as wide as its contents).
The visibility: “hidden”; property is used to specify whether an element is visible or not in a web document but the hidden elements take up space in the web document.
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.
Use display:none instead of visibility:hidden if you want the divs to take up no space when they are not displayed.
125
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
