我正在尝试创建一个类似向导的界面,其中有后退/下一步和重新开始按钮,主要内容占据了大部分空间。这是在 HTML/CSS 中,并且将 jQueryUI 用于 HTML 应用程序 (HTA) 以仅针对 IE8。目前这是我所拥有的:
HTML:
<body scroll="no">
<div id="maincontent">
</div>
<div id="buttons">
<button class="bottombutton" id="backbutton">Back</button>
<button class="bottombutton" id="startoverbutton">Start Over</button>
<button class="bottombutton" id="nextbutton">Next</button>
</div>
</body>
CSS:
.bottombutton {
position: absolute;
margin-top: 20px;
bottom: 10px;
}
.centeredbuttons {
margin-left: auto;
margin-right: auto;
}
#backbutton {
left: 10px;
}
#nextbutton {
right: 10px;
}
#startoverbutton {
position: absolute;
left: 100px;
}
#maincontent {
position: fixed;
height: 340px;
width: 96.3%;
top: 12px;
left: 12px;
}
但是,根据 Accordion 的内容( Accordion 总是放在#maincontent 中)和我希望它填充父 div(#主要内容)。尽管 Accordion 设置为 heightStyle: "fill",但页面之间的高度很容易发生变化。 (使用 load() 将内容动态加载到#maincontent 中。)
这就是我希望它看起来的样子(有些页面确实如此):
以及一些页面的外观(有些比这差很多):
最佳答案
最终我发现了如何解决这个问题。我的问题主要是由于试图将内容加载到具有我的尺寸参数的 div (#maincontent) 中。我需要做的是在 Accordion div 上指定我的尺寸参数,而不是仅在 #maincontent 上指定高度尺寸。这是我为使其工作所做的更改:
#maincontent {
height: 300px;
}
#modeaccordion {
height: 300px;
width: 96.3%;
position: fixed;
top: 12px;
left: 12px;
max-height: 300px;
}
现在,当在页面之间加载时,您甚至无法判断它们是完全不同的 html 页面——大小保持非常稳定。
关于html - 使用 jQueryUI 创建向导 HTML/CSS 界面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20458203/