Нажмите событие для div с двумя плавающими элементами на IE6

Question

У меня есть <div> с двумя плавающими элементами внутри него. Я использую jQuery, чтобы прикрепить обработчик события click к этому <div>. Обработчик вызывается только тогда, когда я щелкаю один из двух всплывающих элементов. Пустое пространство внутри <div> не работает.

Вот как выглядит разметка:

<div class="wrapper">
  <h4>Some lovely header text here</h4>
  <img src="images/plus.png"/>
  <div style="clear: both;"/>
</div>

Вот мой Javascript (я тоже использую некоторые другие события):

// Expand scenarios when clicked on
scenario_header.live("click", function() { 
  $(this).toggleClass("expanded");
  $("+ div", this).slideToggle();
});

// Toggle hover class when hovering
scenario_header.live("mouseover", function() {
  $(this).toggleClass("hover");
});
scenario_header.live("mouseout", function() {
  $(this).toggleClass("hover");
});

Это отлично работает в Firefox. Есть идеи?

Answer 1

Полагаю, вам нужно применить дополнительный CSS, чтобы обертка DIV действительно обернула свои дочерние элементы. Примерно так должно быть достаточно:

div {
 overflow: hidden;
 display: inline-block; /* weird stuff, but it's needed for IE6 */
}
div {
 display: block; /* needed to reset display for non IE6 browsers */
}