Form layout and padding on mobile devices




i have created a form which i added in an overlay in WP in desktop view its fine, but the moment i view in mobile there's changes which are applied.

1- there a padding left and right of at least 30px which narrows the content in the centre

2-the button shape and colour and not the same colour (pink salmon) and the shape is almost round and not square

3-because of this "imposed padding" the content box for the form is also forced to the centre


What is this happening is hubspot is supposed to be responsinve, i mean it will be different is i customised the form and this might been a issue with my code. However this is hubspot default form...Soooooo I have no idea what is going on since i havent done anything other than create the form.



1 Reply 1
HubSpot Employee

Hi @JJC  Apologies no one has reached out to you yet. We had a similar issue with any embedded form that was part of a pop-up or iframe when viewing on mobile. As it turns out, the underlying issue was the mobile html created by iOS 11. 


Apple recently released (just last week) a new update, that fixed the known issues I was aware of. Can you check again to see if the form is rendering correctly now? 


If not, please provide a link to the page in question screengrabs of the issue as well as mobile OS info and any other factors that contribute to this issue. 


Thank you,

Ed Justen 

Did my post help answer your query? Help the Community by marking it as a solution