調整視差上的疊加層大小時出現問題

Question

我剛買了這個模板。 將 window 調整為 991 像素以下時，由於填充 60 像素，覆蓋不適合該部分。 你知道我能做些什么來解決這個問題嗎？

Answer 1

HTML

<div class="parallax-content">
    <div class="container">
        <div class="row">
            <div class="col-lg-12">
                <div class="info">
                    <p>We design and develop <span>web apps</span> that delight your users and grow your business.</p>
                    <a class="btn-white-line" href="#">Contact Us</a>
                </div>
            </div>
        </div>
    </div>
</div>

CSS

.parallax {
min-height: 215px;
overflow: hidden;
position: relative;
padding-top: 60px;
padding-bottom: 60px;
}

.parallax:before {
content: '';
position: absolute;
width: 140%;
height: 140%;
opacity: .80;
background: #585CE9;
z-index: 2;
top: -20%;
left: -20%;
}

.parallax .parallax-content {
position: relative;
z-index: 3;
}

@media (max-width: 991px) {
    .parallax {
        padding-top: 60px;
        padding-bottom: 60px;
        min-height: auto;
    }
}