Jump to content

Form button edges go rounded when viewed on mobile devices

Recommended Posts

Just got a quick question, may be a simple fix.

I have two buttons on my website which are set to have square edges. Both buttons are buttons for a form (one button per form).Now on desktops/laptops all button edges are square, however on mobile devices the button for the form has rounded edges, whilst the other form's button is still square - the only difference between them being that the second form is in lightbox mode.

I tested this and it does it on desktop and mobile versions of the site on iOS in Safari and Chrome

Any ideas on how to fix this ?

Link to comment
  • Replies 7
  • Created
  • Last Reply
  • 8 months later...
17 hours ago, BearVsShark said:

I'm having the same issue. The default button style is set to square, but only on mobile, is it just randomly changing the contact form buttons to rounded edges.

I need a fix for this, please! 

Can you share to page where contain buttons?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
20 hours ago, BearVsShark said:

https://www.highervoltages.com/contact

It's the contact send button. It changes to rounded only on mobile and only on the contact forms. 

Seems fine here. Which device did you use?

Or try adding this to Home > Design > Custom CSS

input.button.sqs-system-button.sqs-editable-button {
    border-radius: 0 !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
1 minute ago, BearVsShark said:

It's happening on iPhones. 

 

6 hours ago, tuanphan said:

Seems fine here. Which device did you use?

Or try adding this to Home > Design > Custom CSS


input.button.sqs-system-button.sqs-editable-button {
    border-radius: 0 !important;
}

 

That worked like a charm! 

Link to comment

Archived

This topic is now archived and is closed to further replies.


×
×
  • Create New...

Squarespace Webinars

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

Hire a Designer

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