Question

I tried to change around the code but for some reason it’s not working as desired.
I want to put the DIV in the middle and while collapsing/expanding i want it slide down or up smoothly. If you click on Show/Hide the page shifts and I can’t seem to figure out why.

Answer 1

the shift is a result of the scrollbar showing or hiding based on the height of the webpage. You can keep the scrollbar so no shift happens

html {
       overflow-y: scroll;
}