首页 > 解决方案 > 内容覆盖了我的页脚 - 想要一个固定或最大高度

问题描述

我无法让内容的主体滚动/具有确定的高度。我已经尝试过最大和最小高度,但我不知道在我的 CSS 中是什么使内容滚动到底部。

网站:https ://go.trustradius.com/TriNet_TriNet-Vertical-Page-COPY.html

min-height,max-height,调整页面高度。等等

身体>

<div id="tqaAllInOne" style="width: 90%;height:500px;margin: auto; padding:50px 0px;
">

    <div id="TQAobject" style="width:20%;min-width:250px;min-</height:400px;display:inline-block;position:absolute;margin-left:15px;border: 1px solid #ccc;background-color:white;">
        <div style="z-index: 100; background-color: white;">
            <div id="blurbContainer" style=" height: ; padding: 15px; padding-bottom: 70px;">
                <h3 style="position:relative; margin:0px 0px 15px 0px;padding: 0px;line-height: 1em;font-size: 1.3em;font-family: inherit;font-weight: 600;">Selected Quote</h3>
                <div id="blurbText" onclick="copyText()" style="font-size: 14px;font-family: inherit;font-weight: 300;line-height: 1.4em;color: #444;text-decoration: none;text-size-adjust: none;margin: 0px;padding: 0px;padding-bottom:20px;text-shadow: none;cursor: pointer;text-align: left;">Select a TrustQuote you would like to copy</div>
                    <button onclick="copyText()" style="position: absolute;bottom: 20px;left: 20px;right: 20px;top: 20px; font-family: serif;font-size: 18px;font-weight: 300;padding: 3px 8px;margin: 0px;cursor: pointer;border-radius: 0px;min-height: 35px;max-width: 300px;top: auto;background-color: #ecf4ff;color: #002269;">Copy Quote to Clipboard</button>
            </div>
        </div>
    </div>

</div>

</body>

标签: htmlcss

解决方案


这不起作用,因为您的子元素具有fixed高度,!important并且它的特异性也大于您的父元素,因此您的 CSS 在这种情况下根本不起作用。

如果你能去掉这个高度,你的问题就解决了,看下图

在此处输入图像描述


推荐阅读