For field design isn't showing up the same on mobile

I’m trying to figure out why my form field design is cutting the text in half. I feel like I’ve tried everything I know, so I’m turning to the experts. It looks fine and as expected on the desktop-mobile preview, but on the iphone it isn’t working. I’ve attached two screenshots and the public link to my site below. Thanks for your help and input.


Here is my public share link: LINK
(how to access public share link)

Ddi you get this fixed? I didn’t see it happening in the Designer. If not can you share the url of the working site?

Yeah that was my point. It’s working in the designer but the screenshot attached previously is from my iphone (actual device).

The live link is http://saturday2.webflow.io/

Thanks,

NF

Needed the live link to look at what’s happening. The text is also being cutoff on Safari desktop. Appears to be because the line-height of the emailaddress class is set to 0px. Try making it like 50px or 1.25em and see if that doesn’t resolve the issue.

As for why it’s showing correctly in the designer I’m not sure other than sometimes on Safari those form fields are a pain. I didn’t look at the Designer in Safari…is it showing correctly there. Otherwise, maybe @cyberdave would have some insight.

Thanks so much for the reply! This fixed it! The weirdest part of this is I swear I did this. I must be mistaken. Thanks so much for taking a look at it and helping out. It was driving me crazy.

No worries. I’ve been there myself…sometimes it’s just a second set of eyes. Glad it worked. I like your text background gif.

1 Like

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.