CODEWITHSUNDEEP
ipadcssmobile-safari
Jitendra Vyas
Jitendra Vyas

Reputation: 152617

Why input is having more roundness in iPad and iPhone?

See here jsfiddle http://jsfiddle.net/KvKsm/2/embedded/result/

edit here http://jsfiddle.net/KvKsm/2/

html

<input type="submit" value="Contact Us">

css

input {
     -moz-transition: -moz-transform 0.2s ease-in-out 0s;
     background: none repeat scroll 0% 0% #2E2E2E;
     border-radius: 8px 8px 8px 8px;
     border: 0pt none;
     box-shadow: 0pt -1px 1px rgba(255, 255, 255, 0.15) inset;
     color: #FFFFFF;
     display: inline-block;
     font-size: 32px;
     line-height: 1;
     padding: 10px;
     text-shadow: 0pt -1px 1px rgba(19, 65, 88, 0.8);width:180px
}

in Desktop browsers

enter image description here

in iPad and iPhone

enter image description here

I want fixed width button.

Upvotes: 0

Views: 586

Answers (1)

Jitendra Vyas
Jitendra Vyas

Reputation: 152617

I found an answer here

http://thinkvitamin.com/design/styling-submit-buttons-for-mobile-safari/

adding -webkit-appearance: none; solved the problem

Upvotes: 4

Related Questions