使用来自 jQueryUI 的 baic redmond 主题，我的 Accordion 不正确。我认为我的样式表中的某些内容导致了问题，但我删除了它，它仍然很时髦。我把它剥离了，回到这个，它仍然在 2 x 行上包裹三角形图标和文本。
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Nodes</title>
<link rel="stylesheet" type="text/css" href="/DFCx/css/jQueryUI_redmond/jquery-ui-1.8.16.custom.css" />
<script type="text/javascript" src="/DFCx/js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="/DFCx/js/jquery-ui-1.8.16.custom.min.js"></script>
<script type="text/javascript" src="/DFCx/js/page/Nodes/view.js"></script>
</head>
<body>
<div id="accordion" class="accordion">
<h3>Title</h3>
<div>junk</div>
<h3>Title</h3>
<div>junk</div>
<h3>Title</h3>
<div>junk</div>
<h3>Title</h3>
<div>junk</div>
</div>
</body>
</html>
Accordion 脚本(view.js)只有:
$( "#accordion" ).accordion({
autoHeight: false,
collapsible: true,
header: 'h3'
});
Accordion 工作完美，打开、关闭、安装等等，当它把图标放在适当的位置时，它只是包裹了 h3!
有关结果的屏幕截图示例，请参阅 http://i.imgur.com/1fwD2.png
当我在 Accordion 配置中使用 "icons: false"时，它会关闭图标并按预期工作，但我希望将它们放在那里!尝试了不同的 UI 样式表(阴天等)和不同颜色的所有相同问题。
有什么我想念的吗？
- 更新(不确定它是否是一个解决方案)
在 jQueryUI css 文件中是这一行:
.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
我编辑为
.ui-icon { display: block; float: left; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
(注意添加 float :左；)
这已经修复了标题中的图标定位，并起到了很好的作用。手指交叉，它对其他图标没有任何令人讨厌的流动影响:(
最佳答案
可能是您使用的生成的 CSS 不包含 Accordion 样式。
尝试使用不同的 CSS，例如，这个: http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/base/jquery-ui.css 。
或者，从此页面中选择您正在使用的主题: http://blog.jqueryui.com/2010/09/jquery-ui-1-8-5/ 。
您仍然需要确保设置 Accordion 标题 as documented 的样式(由 Larry 建议):
<div id="accordion">
<h3><a href="#">First header</a></h3>
<div>First content</div>
<h3><a href="#">Second header</a></h3>
<div>Second content</div>
</div>
关于jQueryUI Accordion 在使用图标时导致换行，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/7549431/