Странная проблема с CSS в IE7

У меня редкая проблема с CSS в Internet Explorer 7 (на самом деле я тестирую ее в IE8 в режиме совместимости, но клиент прислал мне скриншоты и в родном IE7), ее легко воспроизвести:

  1. Перейдите на этот сайт (испанский).
  2. В левом столбце нажмите на границу (или где-то вокруг) поля с надписью «Fiestas anteriores».
  3. Теперь элемент должен быть перемещен вниз, но если вы щелкнете по пустому месту слева, он вернется, как хорошая собака.

Я искал ошибки IE7 и безуспешно играл с шириной, границей и другими свойствами CSS. Любой вклад приветствуется!


person lima    schedule 08.09.2009    source источник


Ответы (1)


Я обнаружил, что если вы примените следующие стили, кажется, что он не сломается, когда вы щелкнете где-нибудь рядом с ним:

#prevparties_middlerow
{
    float:left;
    width:150px;
}

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

<div id="prevparties_left"/>
<div id="prevparties_contentBox">
     content
</div>
<div id="prevparties_right" class="boxmiddle"/>

вам, вероятно, будет намного проще обернуть поле содержимого в div, границы которого установлены в качестве фона, например:

<div id="prevparties_contentWrap">
    <div id="prevparties_contentBox">
         content
    </div>
</div>

Основное преимущество здесь заключается в том, что обертывающий div будет опускаться до уровня содержащего div, поэтому вам не нужно применять определенную высоту ко всем этим граничным div. И когда вещи упакованы вот так, вероятность того, что они сломаются, намного меньше :D

в любом случае, надеюсь, что это поможет.

person Wayne Austin    schedule 09.09.2009
comment
Большое спасибо, сработало отлично! спасибо и за совет, я знаю, что CSS на данный момент довольно дрянной, потому что код для границ был автоматически сгенерирован плагином jQuery (glassbox-js.com), но затем у страницы возникли некоторые проблемы совместимости между плагинами JS, поэтому я взял код, созданный GlassBox, и жестко закодировал его в файле CSS. Я не горжусь этим, но на тот момент работа была сделана, и клиент был доволен. - person lima; 10.09.2009