高度未针对 UL 和 DIV 容器进行调整答案

【问题标题】：height not adjusting for UL and DIV container高度未针对 UL 和 DIV 容器进行调整
【发布时间】：2012-05-05 10:47:13
【问题描述】：

有人知道如何让这个滑块调整高度吗？

http://www.awesomeget.net/#steps-slider

现在高度在 DIV“容器”中设置，但如果您删除高度，则不会显示任何内容。看起来 UL 元素以某种方式没有将其高度提供给父元素。我添加了溢出：隐藏到作为父容器的“steps-holder”和“slide-holder”......并确保这个UL元素没有浮动......但仍然没有任何变化......

任何帮助将不胜感激。

谢谢，

【问题讨论】：

标签： css html height overflow html-lists

【解决方案1】：

div 中的 ul 和 li 元素是绝对定位的，这意味着它们被从正常流程中移除，因此它们所在的 div 不受其大小的影响。删除绝对定位将解决问题，尽管它可能是其他问题的原因。

【讨论】：

【解决方案2】：

在第 705 行的 black.css 文件中，height 属性设置为幻灯片的所有 a 元素。首先删除该部分...然后从具有steps-holder 类的容器中删除overflow: hidden 和height 属性。实际上，我在您的 steps-slider 块中没有发现类为 container 的 div ...请指定它是否是类。这有点误导:)

如果这是你当然希望达到的效果）http://clip2net.com/s/1Qyvr

【讨论】：

【解决方案3】：

如上所述，由于列表项是绝对定位的，除非您删除“绝对”定位，否则您将无法仅使用 css 执行此操作。但是你可以用 jQuery 来做：

移除 div.container 的高度：300px 并添加以下代码：

$(document).ready(function() {
   tmpHeight = $(".slides li").height() + 46; // I added 46 to get to 330, but you should do this with padding in css or something
   $("div.container").css("height", tmpHeight + "px");

}

【讨论】：

谢谢！我试过你的方法，但它只将高度设置为第一个列表项的高度。我需要每个 LI 都有自己的高度。我想以您的建议为基础，并使其对每个 LI 都具有动态性……然后我意识到滑块中已经有此功能的选项！！！该死！制作滑块的人 (nathansearles.com/loopedslider) 已经考虑过了，它的设置在 loopedslider.js 中为 autoHeight = 1 或 false
如果不是您建议在 JQuery 中执行此操作，我不会想通。否则，我会被困在 CSS 中！谢谢大佬