CODEWITHSUNDEEP
ipadhtmlcss
Parag Gajjar
Parag Gajjar

Reputation: 730

HTML input button appears different in iPad

I've created HTML input.

<input type="submit" id="Submitbtn" onclick="javascript:function()" value="Login" name="Submitbtn">

CSS is:

input:hover, input{
     background: none repeat scroll 0 0 #1356B4;
     border: medium none;
     margin-right: 0;
     padding: 3px 10px 5px 0;
     vertical-align: middle;
     border-radius: 5px 5px 5px 5px;
     color: #FFFFFF;
     cursor: pointer;
     display: inline-block;
     font: 14px/26px Arial,Helvetica,sans-serif;
     height: 26px;
     -webkit-transition: all 0.3s ease-in-out 0s;
}

The output in web browsers:

enter image description here

And in iPad:

enter image description here

How to resolve this?

Upvotes: 3

Views: 3893

Answers (1)

Yoann
Yoann

Reputation: 5097

I suppose you must get rid of the webkit appearance on your button by adding in your CSS:

-webkit-appearance: none;

Upvotes: 6

Related Questions