Не удается заставить элемент перекрывать другой

У меня есть сайт Divi WordPress http://linden.flywheelsites.com и я пытаюсь получить идентификатор элемента «atlas_menu1», чтобы перекрыть все другие элементы на странице. Каким-то образом элемент «et-page-area» или «main-content» по-прежнему перекрывает atlas_menu1.

Кто-нибудь может взглянуть на инспектора страниц и посмотреть, можете ли вы найти решение? Я могу предоставить доступ, если это необходимо.

3 ответа

  1. Не могли бы вы посмотреть .et_pb_text_3? Он имеет дисплей: нет. Извините за этот ответ. Я пока не могу комментировать.

  2. Помните, элементы с z-индексом «работают» только на одном уровне.

    Например:

    .parent{position:absolute;width:100px;height:100px;}
    .child{background:red;position:absolute;width:50px;height:50px;margin:auto;top:0;right:0;bottom:0;left:0;z-index:999999;}
    .first{z-index:1;background:blue;}
    .second{z-index:2;left:50px;top:50px;background:yellow;}
    .third{z-index:3;left:100px;top:100px;background:green;}
    .fourth{z-index:4;left:150px;top:150px;background:purple;}
    <div class="parent first">
      <div class="child"></div>
    </div>
    
    <div class="parent second">
      <div class="child"></div>
    </div>
    
    <div class="parent third">
      <div class="child"></div>
    </div>
    
    <div class="parent fourth">
      <div class="child"></div>
    </div>

    Все дочерние классы имеют z-индекс 999999, однако родительский класс с более низким z-индексом остается на вершине дочернего. Это связано с тем, что при наличии вложенных элементов z-индекса дочерний элемент не может перекрывать родительский элемент.

    В вашем случае, #atlas_menu1(z-index:9999)находится внутри.et_pb_row_2(z-index:1), что находится внутри .et_pb_section_4(z-index:-1)

    Попробуйте удалить .et_pb_section_4и .et_pb_text_3z-индекс, затем установите .et_pb_row_2z-индекс на 99999.