Spry tabs in accordion overflow in ie7

Question

I am trying to nest tab panels into accordion panels and it
works great in safari and firefox, however in ie7 the tabs are
overflowing the closed accordion panels. I have tried setting
overflow:hidden on the accordion content div and that did not help.
It acts like a float clearing issue, yet I can figure out at what
level to clear it. I was wondering if anyone had tried to do this.
In the end I can set events to display or not onClick but was
hoping for a css solution as that seems to be where the problem is.
you can see a sample at
http://jdspeer.com/aesi
Thank you in advance for any ideas.
James Speer

Answer 1

Hi Ronald,
Place the constructor withing the Spry region as follows
      <div spry:region="dsGrade5" >
          <div id="Accordion1" class="Accordion" tabindex="0">
            <div spry:repeat="dsGrade5" class="AccordionPanel">
            <div class="AccordionPanelTab">{@name}</div>
            <div class="AccordionPanelContent">{summary}</div>
          </div>
          <script>
               var Accordion1 = new Spry.Widget.Accordion("Accordion1");
          </script>
        </div>
      </div>
I hope this helps.
Ben