CODEWITHSUNDEEP
javascripthtml
user823527
user823527

Reputation: 3712

Closing gap between elements when visibility:hidden

How do I close the gap between elements if I hide a few of them with visibility: hidden?

I have this HTML.

    <div id="logged_in" style="display:inline; visibility: hidden;"><a onclick=""></a>&nbsp;&#8226;&nbsp;</div>
    <a id="login_box" onclick="show_login_user();">Login</a>
    <a id="logout_box" onclick="logout_user();" style="visibility: hidden;">Logout</a>&nbsp;|&nbsp;
    <a onclick="show_register_user();">Register</a>&nbsp;|&nbsp;

When the user is logged out, logout is hidden and there is a gap between login and register. If the user is logged in, there is a gap between the logged_in username and logout.

Upvotes: 0

Views: 637

Answers (1)

ThiefMaster
ThiefMaster

Reputation: 318488

Use display:none; instead. visibility:hidden; does not "free" the space used by the hidden element.

Upvotes: 2

Related Questions