Блог

Главная - Вопросы по программированию - Показать Div сверху .. он не работает в браузере Chrome

Показать Div сверху .. он не работает в браузере Chrome

#javascript #html #css

#javascript #HTML #css

Вопрос:

У меня есть этот div, и я установил его z-индекс: 99999, он отлично работает в Firefox и Safari, но когда я тестирую его в Chrome, нижний колонтитул не является верхним элементом,

Что еще я должен сделать, чтобы сделать его самым верхним элементом 

<идентификатор div="нижний колонтитул" style="z-index: 99999 !важно; ширина: 100%; высота: 65 пикселей; позиция: фиксированная; нижняя часть: 0 пикселей; "> 
 <div class="container">
 <div class="нижний колонтитул-навигация"> 
 <ul> 
 <li><a href="/team/"> Команда </a></li> 
 </ul> 
 <ul> 
 <li> Задания </li> 
 </ul> 
 <ul> 
 <li><Twitter></li> 
 </ul> 
 </div> 
 
 <hr> 
 </div> 
 </div>

Комментарии:

1. Вы обязательно устанавливаете z-индекс для других контейнеров, которые появляются после / до этого, и соревнуетесь за порядок? Вы должны установить z-индекс для всех контейнеров, которые конкурируют за порядок слоев.

2. вы пробовали отправлять обратно элемент, который покрывает ваш нижний колонтитул? например, контейнер находится над нижним колонтитулом, установите z-индекс контейнера равным -1.

3. да, у каждого другого элемента есть z-индекс, я только что добавил!важно для z-index, и, похоже, сейчас он работает в Chrome

4. вы хотите, чтобы нижний колонтитул был сверху? но таким образом вы скроете контейнер со ссылками. или это другой элемент, который остается сверху?

Ответ №1:

http://jsfiddle.net/A5jcT/2/

 <div id="footer">
    <div class="container">
     <div class="footer-nav">
        <ul>
           <li><a href="/team/">Team</a></li>
        </ul>
        <ul>
          <li>Jobs</li>
        </ul>
        <ul>
          <li><Twitter></li>
        </ul>
      </div>

      <hr>
     </div>
 </div>

#footer
{
    border:1px solid blue; z-index: 9999;width: 100%; 
    height: 65px;position: ; bottom: 0px;
}
.container
{
     border:1px solid red;position:relative;z-index: -10
}

.footer-nav
{
     border:1px solid green;position:relative;z-index: -20
}

похоже, вам нужно также расположить другие элементы. Теперь у вас есть нижний колонтитул сверху.