Таким образом, возникла действительно странная проблема, только в Safari 13.0.5, протестированная на нескольких машинах и получившая одну и ту же ошибку.
Сам проект представляет собой сетевое приложение, построенное с Laravel с использованием Laravel Смешайте для компиляции ресурсов.
У меня есть форма с идентификатором profileForm
:
<form id="profileForm">
... inputs
</form>
В этой форме используется стиль формы по умолчанию, который я создал для этого проекта - который работает нормально.
Однако странно то, что некоторые стили из медиазапроса из совершенно отдельного элемента применяются здесь?
.profile-modal {
.. other styles
@media screen and (min-width: 768px) {
padding-left: 70px !important;
padding-right: 70px !important;
}
}
Эта форма не имеет класса .profile-modal
, однако Safari применяет к нему вышеуказанный стиль, предназначенный для совершенно отдельной части веб-сайта.
Если я переименую класс в sass к чему-то совершенно случайному, то есть:
.asdfghjkl {
.. other styles
@media screen and (min-width: 768px) {
padding-left: 70px !important;
padding-right: 70px !important;
}
}
Он все еще применяет эти стили к этому элементу, как видно здесь
Для борьбы с этим я подумал, что В качестве временной меры я мог бы добавить следующее в свой шаблон лезвия, чтобы удалить заполнение:
<style>
.profile-modal{
padding-left: initial !important;
padding-right: initial !important;
}
</style>
Однако это не относится к сломанному элементу, чтобы заставить его работать, я должен использовать правильный идентификатор #profileForm
.
Кто-нибудь еще имел эту проблему в последней версии Safari?