Somewhere within the Helix framework there is a very subtle difference beween the cassiopeia template and the shaper helix utimate.
When using a contact form from another provider called "Contact Enhanced" and I have an annoying problem with fields moving down the screen as thay are filled in.
Have look here :https://groupndracing.com/contact-us
When using Cassiopeia template the following changes happen:
When the form loads, the <label> element under the <input> field has an attribute for Style="Display:none"
After entering something into the first <input> field and then clicking onto the second<input> field the <label> element under the first<input> field has an attribute for Style="Display:block"
When using shaper helix ultimate template the following changes happen:
When the form loads, the <label> element under the <input> field has an attribute for Style="Display:none"
After entering something into the first <input> field and then clicking onto the second<input> field the <label> element under the first<input> field has an attribute for Style="Display:inline-block"
According to some very limited research i have done, Display:inline-block will reserve space based upon the line height of the parent element which in this scenario is 27px based ubon the line-height of the outer <div> but Display:block does not reserve any space
When set to use helix template and using the browser console i can change this attribute from inline-block to block and thus remove the unwanted space.
Somewhere within the Helic Framework or the Ultimate template there is a very subtle difference in how form fields are managed that sets the following <label> attribute to Display:inline-block rather than display:block
Hopefully you can identify whats causing this subtle yet very annoying problem