Проблема с девайсами ios

@inrich · Регистрация: 11.05.2015

Author24 — интернет-сервис помощи студентам

Здравствуйте всем.
Прошу помощи)

http://t95025mq.beget.tech/buch/index.html

На скриншоте показал, какие блоки поплыли.

Плывут они конкретно на айфонах, причем смещаются примерно на 100-200px.

Подскажите пожалуйста, как достучаться через css к ios устройствам? И возможно ли это?
Либо есть какие-то другие пути решения?
На втором скрине сама проблема.

@barbdos · 26.03.2020, 19:45

Проблема скорее всего возникает из за верхней панели в браузере, проблема встречается не только на ios, но там ее сложней решить.
Почему возникает баг, возможно из за того что js некорректно отрабатывает или разметка кривая.
Конкретное решение подсказать сложно не взглянув на код.

Подскажите пожалуйста, как достучаться через css к ios устройствам? И возможно ли это?

Достучаться до ios можно только через запросы.
Через css потенциально можно, но это решение скорее приведет к проблемам в другом браузере на ios.

CSS

1
2
3

@media only screen and (min-device-pixel-ratio: 2) {
ваши стили под девайсы с ретиной
}

@inrich · 27.03.2020, 10:48 **[ТС]**

Проблема в том, что эти стили срабатывают и не только для айфонов.
Но и для моего андроида почему-то тоже

@NTHing · 27.03.2020, 18:18

Попробуйте добавить в стили это:

CSS

.container, .absolute_block_mobile
{
position:absolute;
top:50px;
}
 
@media screen and (max-width: 991px)
.clients 
{
padding-top: 0;
margin-top: 50px 0px;
}

@inrich · 27.03.2020, 19:02 **[ТС]**

Не помогает.
Причем используется bootstrap.
Так что с вашими стилями летит вся верстка.

Мысль я вашу понял, но не выходит

@inrich · 27.03.2020, 19:47 **[ТС]**

Было принято решение переделать блоки вот так)

@NTHing · 27.03.2020, 20:05

Правильно... на костылях далеко не уедешь...)
Хотя я Вам давал приемлемый вариант...)

@NTHing · 28.03.2020, 12:02

Сообщение от NTHing

Попробуйте добавить в стили это:

CSS

.container, .absolute_block_mobile
{
position:absolute;
top:50px;
}
 
@media screen and (max-width: 991px)
.clients 
{
padding-top: 0;
margin-top: 50px 0px;
}

Извиняюсь! Неправильно написал... Правила position и top нужны только для класса absolute_block_mobile
А иначе, да, летит всё...)

@inrich 1 / 1 / 0 Регистрация: 11.05.2015 Сообщений: 42
		1
	Проблема с девайсами ios 26.03.2020, 18:55. Показов 993. Ответов 7 Метки css, html, ios, iphone (Все метки) Здравствуйте всем. Прошу помощи) http://t95025mq.beget.tech/buch/index.html На скриншоте показал, какие блоки поплыли. Плывут они конкретно на айфонах, причем смещаются примерно на 100-200px. Подскажите пожалуйста, как достучаться через css к ios устройствам? И возможно ли это? Либо есть какие-то другие пути решения? На втором скрине сама проблема. Миниатюры 0

@inrich 1 / 1 / 0 Регистрация: 11.05.2015 Сообщений: 42
	27.03.2020, 10:48 [ТС]	3
	Проблема в том, что эти стили срабатывают и не только для айфонов. Но и для моего андроида почему-то тоже 0

@inrich 1 / 1 / 0 Регистрация: 11.05.2015 Сообщений: 42
	27.03.2020, 19:02 [ТС]	5
	Не помогает. Причем используется bootstrap. Так что с вашими стилями летит вся верстка. Мысль я вашу понял, но не выходит 0

@inrich 1 / 1 / 0 Регистрация: 11.05.2015 Сообщений: 42
	27.03.2020, 19:47 [ТС]	6
	Было принято решение переделать блоки вот так) Миниатюры 0

@NTHing 1757 / 912 / 373 Регистрация: 26.11.2014 Сообщений: 1,867 Записей в блоге: 1
	27.03.2020, 20:05	7
	Правильно... на костылях далеко не уедешь...) Хотя я Вам давал приемлемый вариант...) 0

	28.03.2020, 12:02