1

I have an div which contains some text which has it's opacity set to 0 and visibility set to hidden, but when another element is clicked, the opacity goes to 1 and the visibility is visible, but this causes the page to scroll a small amount rather than the expanded content just pushing the content below it down and making the page longer. How can I solve this?

Elliott Coe
  • 543
  • 3
  • 6
  • 18
  • please add code snippet or jsfiddle link. thanks – Xenio Gracias Jan 21 '19 at 12:14
  • Why goes the opacity to 1? Do you want this? When you use `visibility: hidden`, you hide something, but it still takes his physical space. If you don't want that, you can use `display:none` instead of visibility – d-h-e Jan 21 '19 at 12:17
  • Please follow this guidance here. https://stackoverflow.com/help/mcve. As you have no code of your own, you should add some per site guidlines – Mark Schultheiss Jan 21 '19 at 12:44

1 Answers1

2

When an element's visibility is set to hidden the element is still there its just transparent. But the extra space will stay. By changing visibility: hidden to display: none the element is totally hidden and won't take extra space. Check this post for a better explanation: StackOverflow

Tygo
  • 196
  • 3
  • 29