Jump to content

Input Issues on Mac/iOS and Chrome

By whitewolf, in Customize with code

Go to solution Solved by creedon,

Recommended Posts

whitewolf Level 3

whitewolf

Posted
Posted

Site URL: https://www.telemetrix-tech.com/homepage

Page URL: https://www.telemetrix-tech.com/homepage
Page Password: RestrictedForNow

Issue: At the bottom of this page is a form as well as a newsletter form in the footer. I'm on windows and everything's looking great in Chrome for those forms but our UI reviewer uses Mac/Chrome combo and the form placeholders are not showing. I tried debugging with another team member who has a Mac but all we could really determine is that the inputs are getting a height of 0, instead of leaving room for content. 

When we inspect the code and compare to another of our sites on Squarespace, using all the same stylings, the placeholder text is showing and everything is the same as on my windows machine. 

I'm really not sure what's causing the issue and I'd appreciate help if someone knows something that could cause this on this specific site. I've also attached what I'm seeing and the screenshot they had sent. (There was an update since the Mac screenshot where I've changed the Message input from textarea to just text.)

Thanks in advance for help.

mac_chrome_form.png

windows_chrome_form.png

Link to comment
  • Replies 2
  • Views 435
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

  • Solution
creedon Level 15

creedon

Posted
  • Solution
Posted

The issue appears to be the font in the following rule-set. 

.Prefooter-blocks .sqs-block-form .form-wrapper .form-inner-wrapper form .field-list .field .field-element {
  -webkit-appearance: none;
  appearance: none;
  padding: 25px 20px;
  background: #353741;
  border: 1px solid #52545d;
  border-radius: 0;
  font-size: 17px;
  color: #fff !important;
  /* font-family: "Gotham"; */
  margin: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

 

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

Sign Up / Login
Go to topic listing

News

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Upcoming Webinars →

Hire a Designer

Stand out online with the help of an experienced designer or developer.

Get Matched →

Support

Community

Developers

Resources