I am baffled with this seemingly simple task. I created a test file which can be downloaded here if anyone wants to help me tackle this.
So basically I got one static rectangle and a button underneath it. They both stay in place while the page is scrolling. When the button is clicked it triggers scrolling (and a fade out scroll effect of the button) and a rectangle pops up from underneath it. The problem is, I want that second rectangle to be centered in the page... I cannot seem to achieve this no matter what combinations of pinning options I use.
Is there something I'm failing to see here? How do I achieve for the second rectangle to always stay in the centre of the browser?
You simply won`t need any pinning in fixed width layout/breakpoints. With pinning it gets worse in this case.
Thanks but if I don't pin the elements, how do I get them to stay in the centre of the browser?
You should add some breakpoints of course.
You may download your file here:
I added some breakpoints, I did not change the size of the elements, though.
If you don`t want to add breakpoints you must at least the minimum breakpoint to a smaller value than in your original file.
Thank you! I knew it was something obviously blatant