Button issue with IOS and CSS

HTML-CSS
#1

Hi there!
I have an issue with the button whith IOS - It basically ignores the style, border-radius, and padding. I suspect my code is wrong but I can’t figure out how to fix it.

input[type=submit] {
background-color: var(–indigo-700);
border: 1px solid var(–indigo-900);
color: var(–white);
font-weight: var(–fw-500);
text-transform: uppercase;
font-size: 1.1rem;
padding: 1.3rem;
border-radius: 4px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
cursor: pointer;
}

Here is the button style
Screenshot 2022-09-05 at 20.01.38

#2

I am not an iOS user and trying to help.

This post seems to be similar to yours

Have you tried that solution?

Cheers

#3

I think his issue might the syntax. Esp this part.

input[type=submit] {
#4

That’s a good catch, I did not see that.

#5

The issue is fixed now?

#6

Not sure, we have to wait for the original poster. :grin:

#7

Nope! Have a look at codepen

#8

Same issue. see codepen

#9

Have you tried the solution given in stackexchange?

Also, we couldnt see it not working as most of us don’t have iOS. So both code and screenshot might be required to troubleshoot this problem :thinking:

#10

Ir works - this is the snippet for IOS :slight_smile:
input[type=“text”],
input[type=“submit”],
.input-checkbox {
-webkit-appearance: none;
border-radius: 4;
}