Cognito-forms – Unwanted scrolling on multipage form

cognito-forms

I have integrated a Cognito form into a section of a new page I'm creating. It works like a charm except there is something that makes the form scroll down so the first active text (or other) field roughly aligns with the bottom border of the menu. You have to scroll up in order to read the label above the fields respectively. This happens every time you hit the "back" or "forward" button to go to another page of the form.

The pages of the form all have a different height, but I'd still expect the form not to scroll but to expand towards the bottom of the page.

The CMS is WP and the theme is the Stockholm theme. (The site is currently under construction and not accessible to anyone except me.)

Any hints on how to tackle this issue?

Best Answer

I’m a developer with Cognito Forms. The form is scrolling the new page into view during page navigation. The problem is that the top of the page is position under the menu that is fixed position. Currently, our scroll into view logic does not provide a way to handle fixed position headers/menus. However, one possible workaround is to increase the top margin of the form to the height of the fixed position header. This will prevent the content of the form from being hidden under the header. The following CSS should do the trick:

.c-forms-form-body > .c-section { margin-top:<height of the fixed position header>px!important; }