简体   繁体   中英

Accordion inside other accordion does not resize height of body content with Internet Explorer

I have done with Bootstrap 2.0 an accordion which has other accordion in its body:

<div class="accordion" id="accordion1" >
    <div class="accordion-group">
        <div class="accordion-heading">
            <a href="#content1" data-toggle="collapse"
                data-parent="#accordion1" class="accordion-toggle">Accordion1</a>
        </div>
        <div class="accordion-body" id="content1" >
            <div class="accordion-inner">
                <div class="accordion" id="accordion2">
                    <div class="accordion-group">
                        <div class="accordion-heading">
                            <a href="#content2" data-toggle="collapse"
                                data-parent="#accordion2">Accordion2</a>
                        </div>
                        <div class="accordion-body collapse" id="content2">
                            <div class="row-fluid">
                                <div class="span3">
                                    <a href="#">Button1</a>
                                </div>
                                <div class="span3">
                                    <a href="#">Button2</a>
                                </div>
                                <div class="span3">
                                    <a href="#">Button3</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

Using Internet Explorer 9, the first time that I load the principal accordion ( accordion1 ), which is loaded opened and the accordion2 closed, when I open the accordion2 ,it resizes the height of the accordion1 to show its content correctly. But after that, if I collapse accordion2 , and after I collapse accordion1 too, when I re-open accordion1 and after accordion2 , accordion2 doesn't resize the height of accordion1 ...and therefore I don't see the content of accordion2 .

With Firefox there are no problem, Firefox resizes the content of accordion1 without any problem. I tried to put property height:auto but it doesn't do anything...

Thanks.

I've solved my problem. The solution is that Internet Explorer 9 have this bug, but in Internet Explorer 10 this problem is solved.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM