Как отобразить один DIV поверх другого DIV в IE6? - PullRequest
Новая
       2

Как отобразить один DIV поверх другого DIV в IE6?

1 голос
/ 11 апреля 2011

Я пишу некоторый HTML-код, имеющий следующую структуру 

<div style="position:relative">
<form>
<table>
<tr>
<td> <div id="Upper_Element" style="position:absolute;z-index:10"></div> </td>
</tr>
<tr>
<td> <div id="Lower_Element" style="position:absolute;z-index:-1"></div> </td>
</tr>
</table>
</form>
</div>

здесь Upper_Element - это текстовое поле автозаполнения YUI (где предложение отображается, когда пользователь вводит что-то похожее на Google), а Lower_Element - обычный выпадающий список (<select>).В IE6, когда отображаются предложения автозаполнения, Lower_Element отображается над списком предложений.В других браузерах, таких как IE8, работает нормально.Я попробовал атрибуты позиции и z-index, но не повезло.

Пожалуйста, дайте мне знать, что еще можно попробовать.

Заранее спасибо!

Ответы [ 2 ]

1 голос
/ 11 апреля 2011

Что вы подразумеваете под "Lower_Element - это выпадающий список normal "?Это элемент <select> или <div>, как в вашем примере?Если это <select>, то вы видите очень старую ошибку , которая затрагивает IE6 и уже много раз задавалась / решалась, например проблемы Z-Index с IE6 и html

0 голосов
/ 11 апреля 2011

Используйте атрибуты position: absolute и z-index для позиционирования одного элемента над другим

Ссылки по теме:

код 

<div style="position:absolute"> ... </div>

Позиционирование: 

<div style="position:absolute; top: 100px; left: 100px"> ... </div>

UPD 

<div style="position:relative">
  <form>
    <div id="upper_element" style="position:absolute; z-index:2">I am top level div!</div>
    <div id="lower_element" style="position:absolute; z-index:1">I am on the bottom of life</div>
  </form>
</div>

http://jsfiddle.net/vLx6X/

...