jquery - jQuery-ui Accordion 中的 float 内联 div 会破坏可变宽度吗？

Question

我正在使用 Accordion 创建一个时间表，该时间表的标题由从数据库查询返回的信息组成。我需要能够在标题中放置几个​​离散的元素(名称、ID 号、日期、时间)。当我将 div 放入标题链接时，它们会垂直显示。我希望它们水平显示。所以我添加了一个 float:left;对他们来说，但这会破坏 Accordion 。这是代码:

HTML

<div id="schedule1">
    <h3 class="accordionTitle">
        <a href="#" class="accordionLink">
            Title
        </a>
    </h3>
    <div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pellentesque etc...
    </div>
</div>
<br /><br /><br />
<div id="schedule2">
    <h3 class="accordionTitle">
        <a href="#" class="accordionLink">
            <div>
                <div class="inline">title</div>
                <div class="inline">text</div>
                <div class="inline">in</div>
                <div class="inline">inline</div>
                <div class="inline">divs</div>
            </div>
        </a>
    </h3>
    <div>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. In pellentesque etc...
    </div>
</div>

CSS

.accordionLink {
    font-weight: bold;
}
.inline {
    float: left;
}

JS

$(document).ready(function() {
    $('#schedule1, #schedule2').accordion({ 
        header: "h3",
        collapsible: true,
        active: false,
        fillSpace: true
    });
});

如有任何帮助，我们将不胜感激。

谢谢

Answer 1

尝试

.inline {
    display: inline-block;
    /* "float: left" must be removed */
}