уважаемые. Заметил дилемму такого рода: загрузил сайт на хостинг, на ПК в Dev Tools всё отлично (выбираю размер экрана как на IPhone 7), но когда захожу на этот же сайт с телефона (тот же IPhone 7) - сайт отображается не совсем так, как на пк в Dev Tools.
Ниже приведу пример, на скриншоте #1 (ПК) есть желтый border при фокусе, та и вообще там есть только нижняя рамка, без закругления. На скриншоте #2, 3 (IPhone 7) у этой рамки появляется закругление и кнопка ведет себя по-другому.
Прошу помощи, как это можно решить?
код кнопки:
.signUp__button {
color: #fff;
background-color: rgba(255, 255, 255, 0);
border: 2px solid #fff;
border-radius: 20px;
padding: .2em 1.5em .2em 1.5em;
margin-bottom: 1.2rem;
cursor: pointer;
transition: all .2s ease-in-out;
font-size: 16px;
font-weight: 400;
box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1);
}
<button class="signUp__button">SIGN UP</button>
.signUp__button { color: #fff; background-color: rgba(255, 255, 255, 0); border: 2px solid #fff; border-radius: 20px; padding: .2em 1.5em .2em 1.5em; margin-bottom: 1.2rem; cursor: pointer; transition: all .2s ease-in-out; font-size: 16px; font-weight: 400; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.1); }