Home/ Questions/Q 6852711
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-27T01:25:31+00:00

Imagine I have 3 lines of text for example like below: Line 1: This

  • 0

Imagine I have 3 lines of text for example like below:

Line 1: This is text 1

Line 2: This is text 2

Line 3: This is text 3

Now what I want to do is hide Line 2, but I want Line 3 to push up to the same position where Line 2 is, when Line 2 becomes visible then I want Line 2 to slot right back to where it was and Line 3 to go back to its original position.

So what I want to know is which is the best css property to use for this because I tried visibility:hidden and display:none and even though they both work when it comes to hiding Line 2 and making Line 2 reappear, they both don’t allow Line 3 to move up automatically when Line 2 is invisible so it leaves a big gap in the middle which makes the appearance look a bit sloppy.

Thank You

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    display: none; on line 2 should move up line 3 and below automagically as it won’t preserve space. You’ve got another problem with your positioning; absolute positioning stated by @JCOC611 is a good bet.

    See fiddle: http://jsfiddle.net/NFsN6/2/ where span is hidden by each method and thus p container has no visible content anymore but exhibit 2 different behavio(u)rs. 0 height in case of display: none; and still the same look but empty in case of visibility: hidden;

    Could you please post some code that reproduces your problem?

    • 0