Why Is Button CSS Style Shown Differes on iPhone Safari Browser?

When testing my new site on iPhone I noticed that my CSS style is different on mobile Safari. I provided styles for buttons, but mobile Safari added some different styles to it.

I tried to disable some additional CSS parameters, but with no success. Then I noticed that Safari mobile browser is adding -webkit-appearance: property to the site.

To overcome this changes made by mobile Safari we have to use -webkit-appearance:none code.

More on -webkit-appearance: predefined styles is here.

Notice: on Safari and Chrome desktop browsers selects it removes down arrow.

This entry was posted in Mobile Websites and tagged . Bookmark the permalink.

Leave a Reply

Your email address will not be published. Required fields are marked *