Селектор встроенного стиля CSS не работает для iOS (Safari, Chrome) - PullRequest
Новая
       10

Селектор встроенного стиля CSS не работает для iOS (Safari, Chrome)

0 голосов
/ 12 сентября 2018

У меня есть что-то вроде этого:

HTML: 

<body style="overflow: hidden;">

<div class="test"></div>

</body>

CSS / МЕНЬШЕ: 

body[style*="overflow: hidden"] {
.test {z-index: 1;}
}

Когда тело имеет переполнение встроенного стиля: скрыто, я пытаюсь придать некоторый стиль тестовому элементу div. Это работает во всех браузерах, на всех устройствах Android, но на iOS (iphone x, 8 и т. Д.) Не работает. Не имеет значения, что Safari или Chrome на iOS не работают.

Есть предложения?

1 Ответ

0 голосов
/ 12 сентября 2018

Я думаю, что это должно точно соответствовать. Попробуйте без звездочки (*). 

body[style="overflow: hidden;"] {
    .test {z-index: 1;}
}

Стиль должен точно соответствовать.

Однако я бы посоветовал вам использовать классы для этого, приведенный выше код очень уродлив.

Попробуйте это:

HTML 

<body class="overflow-hidden">
    <div class="test"></div>  
</body>

CSS 

.overflow-hidden .test {
    z-index: 1;
}

МЕНЬШЕ / SASS 

.overflow-hidden {
    .test {
        z-index: 1;
    }
}
...