Thoughts and Notes on Software Development

Hide HTML Element Without Taking Up Space

Most of the time, using display: none; is all you need to hide an HTML element. But every once in awhile, doing so will hide the element, but would not reclaim the space the element would have been occupying.

To hide an HTML element and not have it take up space, you can do something like this:

#post-signature-hidden {
    max-height: 0;
    margin-top: -3em;
    visibility: hidden;
}

In case you're wondering, that's the CSS I use to stop my Post Signatures from showing up on the pinned pages on my journal.

Tags: #HTML #CSS

Discuss... or leave a comment below.