HTML + CSS z-index не работает - PullRequest
1 голос
/ 07 декабря 2011

У меня очень досадная проблема: мой z-index не работает, а div расположен выше (по оси y), а не поверх (по оси z) другого div.

Это, вероятно, будет совершенно очевидно, но я не вижу проблемы с моим кодом.Может кто-нибудь определить, где я иду не так?Это должно быть так легко, но я так расстроен, потому что не могу найти решение.

<style>
.greenleftarrow{
position: relative;
z-index:10;
display:block;
background:#fff url(./images/greenleftarrow.jpg) no-repeat;
left:10px;
top: 0px;
height:140px;
opacity:0.5;
filter:alpha(opacity=50);
}

</style>


<body id="body1" style="position: relative; z-index:-1; height: 510px;" onload="javascript:showAndroidToast('1'); inspectLang(); getDocHeight()">
<div class="greenleftarrow"  id="greenleftarrow" ></div>
<div  style="position: relative; z-index:-1;">body body body body</div>
</body>

Ответы [ 2 ]

5 голосов
/ 07 декабря 2011

Попробуйте изменить положение стрелки на абсолютное.

  .greenleftarrow{
  position: absolute;
  z-index:10;
  display:block;
  background:#fff url(./images/greenleftarrow.jpg) no-repeat;
  left:10px;
  top: 0px;
  height:140px;
  opacity:0.5;
  filter:alpha(opacity=50);
  }
1 голос
/ 07 декабря 2011

Если я правильно понимаю, вы можете использовать отрицательное верхнее поле для перемещения второго делителя вверх на зеленую стрелку:

http://jsfiddle.net/XSH2Y/

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...