Деактивация содержимого и z-index IE6

[100kd]

Казалось бы не тривиальная задача сделать вот такое выдвигающееся меню у блока —

Но возникла достаточно неприятная ситуация. Во первых в обычных браузерах ссылки на меню неактивны, т.к снизу находится блок, который перекрывает их, не смотря на то что в меню указан высокий z-index и она визуально находится выше. А ИЕ6 и вовсе игнорирует высокий z-index меню и отображает нижний блок поверх неё —

Страница с проблемными блоками. Прошу помочь. Код выкладывать не буду, т.к его много и просто так без каких-то помощников, типа Inspect Element'а для фаерфокса не разобраться.

Edited July 19, 2009 by 100kd

[DCat]

В IE6 z-index слою выдается на уровне родителя.

Поэтому, если у родителя z-index меньше чем у соседних элементов (например элемент описан ранее в коде, чем сосед), то соседи всегда будут выше его содержимого, какой z=index не пропиши - одна история...

Решение в Вашем случае: меняйте z-index элемента, и его родителя.

Но лично я предпочитаю создавать подобные выпадалки в виде отдельного слоя, лежащего в BODY и открывать там где нужно с нужным содержанием...

[100kd]

DCat, спасибо! Стало понятно с z-index для ИЕ6, а как быть с неактивными ссылками? Там где начинается новый блок ссылки так и подсвечиваются при наведении, но не работают и так во всех браузерах.

Edited July 19, 2009 by 100kd

[Tokolist]

Проверьте код валидатором и поймете, что у вас не так.

Как минимум, нельзя пихать блочные элементы в строчные.

[100kd]

Проверьте код валидатором и поймете, что у вас не так.

Как минимум, нельзя пихать блочные элементы в строчные.

Спасибо, Ярослав!

Проверил валидатором и ничего кричического не нашел. А можно подробнее про блочные элементы в строчных? Сделал ссылку в которую входят блочные элементы тоже блочной, но ничего не поменялось.

[Tokolist]

Для того чтобы исправить проблему надо сначала пройтись по ошибках, которые найдет валидатор и исправить их, иначе действия браузеров будут непредсказуемы, даже если ссылку делать блочной (display: block)

1. если используете XHTML 1.0, то надо писать

<link rel="shortcut icon" href="favicon.ico" />

2. нельзя делать так

	<a href="#" class="none"> 
	 <div class="ev_porthole">
	  <div class="ev_week"><span>Среда</span></div>
	  <div class="img" style="background:url(files/event-image-poster.jpg)">
	   <div class="ext_border">
		<div class="ev_circle_of_date">
		 <div class="ev_days ev_day_19"></div>  
		</div>

	   </div>
	  </div>
	 </div>
	 <b class="b_cat">Выставка</b>
	 <p class="name">Персональная выставка продаж Фридона Асланяна</p>
	</a>

и так

	<a href="#"> 
	 <div class="ev_porthole">
	  <div class="img" style="background:url(files/events/2.jpg)">

	   <div class="ext_border"></div>
	  </div>
	 </div>
	 <b class="b_cat">Концерт</b>
	 <p class="name">Mamanet – TranceXpedition</p>
	</a>

3. Закрыть body и html

Вот исправите эти, на первый взгляд не критичные ошибки (особенно п. 2), тогда можно будет двигаться дальше.

[Tokolist]

Еще здесь посмотрите, хотя вроде это не ваш случай.

[Tokolist]

Все банально просто - у вас атрибут href отсутствует в двух нижних ссылках))))))

А говорите нет критичных ошибок.

Edited July 19, 2009 by Tokolist

[100kd]

Уааа, какой я не внимательный... ёлы-палы.

Ярослав, вы чудо. Большущее спасибо! ;-)

Для меня верстка почти как магия, все делаю по наитию и потом разобрать не могу что натворил.

Edited July 19, 2009 by 100kd