Для тех, кто прибывает сюда позже, правильный ответ - поставить position: relative;
или любой другой position
реквизит на проблемные элементы.
Я бы рекомендовал поставить это на каждый элементс проблемой:
position: relative;
z-index: 0;
, а затем увеличьте z-index
для самого заднего элемента (элементов) перед iframe.
Если вы это сделаете, вы будетеначать выигрывать довольно быстро.
В моем тестировании здесь, z-index
работает, только если вы явно указали position
.Проверьте это, смодулировав значения z-index
, а затем попытавшись выделить текст на экране, щелкнув мышью.Вы должны увидеть свидетельство того, что слои действуют как угодно или ужасно неправильно.
Я считаю, что это прекрасно работает, если вы нажмете F12 (чтобы открыть панель разработчика в Chrome), а затем нажмете кнопку Inspectв верхнем левом углу или нажмите CTRL + SHIFT + C .Затем вы можете навести курсор мыши на все и посмотреть, какой контекст их размещения относится к смежным элементам.
СОВЕТ ПО БОНУСУ UX : помните, что пользователи могут захотеть скопировать текст, поэтому убедитесь, что они могутвыберите его.
Если у вас возникли проблемы, скорее всего, вы либо:
- отсутствует
position: relative;
в родительском элементе, либо - отсутствует
z-index: 0;
где-то