Почему предложения автозаполнения карт Google, связанные с браузером iOS Safari, размещаются неправильно ⇐ CSS

[Anonymous]

Я создал текстовое поле автозаполнения Shopify. он работает как в Windows, так и в браузерах Chrome для Android. Браузер Apple Safari тоже работает нормально. но все равно он не работает для браузера iOS Safari. я приложу скриншот для этого. это мой текущий CSS

Код: Выделить всё

/* Safari-specific styling */
@supports (-webkit-touch-callout: none) and (not (hover: none)) {
.pac-container {
position: absolute !important;
top: 100% !important;
left: 0 !important;
z-index: 1000 !important;
width: 100% !important;
max-width: none !important;

/* Additional styling for Safari */
border: 1px solid #ccc;
border-top: none; /* Remove border from top to match input box */
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
background-color: #fff;
}
}

/* General adjustments to support all browsers */
.pac-container {
z-index: 1000 !important;
}

но мне нужно вот так


пожалуйста, помогите мне решить эту проблему

Подробнее здесь: https://stackoverflow.com/questions/790 ... -placing-i