在jquery中的可折叠/手风琴

Question

我使用以下代码嵌套可折叠：

<div id= "accordion" data-role="collapsible" data-position="inline">
    <h2>
        <div class='ui-grid-a'>
            <div class='ui-block-a'>
                <?php echo $mydate ?>
            </div>
            <div class='ui-block-b'>
                <img align='right' src="/img/arrow.png"></img>
            </div>
        </div>  
    </h2>
        <?php foreach ($result as $id=>$res): ?>
            <p>
                <div id="accordion1" data-role="collapsible" data-position="inline">
                <h3>
                    <div class='ui-grid-a'>
                        <div class='ui-block-a'>
                            <?php echo $id; ?>
                        </div> 

                    </div>
                </h3>
                    <p> 
                        <?php foreach ($res as $r){
                         print_r($r['ID']); echo '<br>'; } ?>
                    </p>
                </div>
            </p>

        <?php endforeach; ?> 


    </div>

正如您所看到的那样，可折叠部分是重叠的。 01-mar-2012是一个可折叠的部门，另一个是可折叠的。冷存储是部门可折叠的价值。任何人都可以告诉我该做什么，以便价值和其他可折叠的不重叠（冷藏与2012年2月25日重叠）？

感谢您的期待。

BasicGem

Answer 1

将此添加到样式表

.clearfix {
    *zoom: 1;
}
.clearfix:before, .clearfix:after {
    display: table;
    content: "";
}
.clearfix:after {
    clear: both;
}

然后在您上次</p>之后添加此行<div class="clearfix></div>

希望有所帮助！