jQuery .slideToggle не меняет размер содержимого div

Question

У меня есть простые .slideToggle в заголовках моей категории на сайте: http://www.UtahCodeCamp.com/Sessions/:

// Slide Toggle the headers
$(".collapse-track").each(function () {
 $(this).click(function () {
  $(this).next().slideToggle();
 });
 $(this).css("cursor", "pointer");
 $(this).next().hide();
});

Все отлично работает в FireFox и Chrome / Safari, но в IE8 размер родительского div (с желтой рамкой внизу) не изменится. Затем, если вы развернете все категории и снова свернете их, заголовки категорий будут располагаться прямо друг над другом.

Есть идеи, как это исправить для IE8? Меня не так интересует совместимость с IE6 или ниже, но я бы хотел поддерживать IE7 / 8.

Answer 1

Проблема, с которой вы столкнулись, напрямую не связана с методом jQuery slideToggle. Вместо этого это связано с одним из ваших правил CSS. Я использовал панель инструментов разработчика, чтобы изменить следующее:

.FloatLeft {
   width: 850px;
   /*display: inline-block;*/ /* This line was causing the problem */
}

Я не проверял, повлияет ли это на Firefox или chrome.