如何停止正文内容显示在页脚内容及下方答案

【问题标题】：how to stop body content showing over footer content and below如何停止正文内容显示在页脚内容及下方
【发布时间】：2014-08-11 22:30:40
【问题描述】：

我正在使用自动完成文本框，这里基于动态值超出滚动条，如果超过文本框滚动条中显示的值自动超过页脚页面并显示两个滚动条。如果文本框滚动条中显示的更多值不应超过页脚内容，则仅显示在正文容器中，也不显示两个滚动条，所以请帮我解决这个问题。

css代码：

.ui-autocomplete {
    max-height: 28%;
    overflow-y: auto;
}

自动完成代码： area数据类型是数组，它包含多个值

autocomplete({
    autoFocus : true,
    source : areas,
    selectFirst : true,
    select : function(event, ui) {
};

图片

【问题讨论】：

【解决方案1】：

一个示例代码会很有帮助，但从所附图片中，我猜您的 body 容器 的父级具有固定高度，而您的 body 容器具有静态定位。

如果是这样，您需要将 body 容器 的 CSS 位置更改为 relative 并为您的 .ui-autocomplete 类分配固定高度：

.body-container {
    position: relative;
}

.ui-autocomplete {
    max-height: 100px; /* For example */
}

如果您从 body 容器 的父级移除固定高度，第二个滚动条应该会消失。如果您必须保持固定高度，则将 overflow-y 设置为 hidden。

【讨论】：