Почему слетает border у input в мобильном браузере safari, chrome и др?

Question

[Максим Макаров]

Добрый вечере, я в верстки новичок и умнея возникла проблема с input, на десктопе input отображается корректно, ссылка на картинку 1 а на телефоне border слетает и получается такая ерунда ссылка на картинку 2. Подскажите как это можно исправить

Вот стиле данного input

border: none;
    background-color: #A57EB7;
    color: #fff;
    width: 20%;
    text-align:center;
    padding: 6px 12.5px;
    font-size: 14.5px;
    height: 30px;

Answer 1

[Владислав Токарев]

Попробуйте прописать свойство border-radius: 0

Comments

[Максим Макаров]

Благодарю за помощь

Answer 2

[imko]

Изменить appearance

Comments

[Максим Макаров]

Благодарю за помощь