html - DIV部分隐藏在固定导航下

我正在开发此网站，该网站的顶部包含固定导航。当我开始开发网站的主要内容时，保存内容的DIV容器部分隐藏在固定导航下。

可以通过以下URL查看此内容：http://rcb.com.mt/wordpresstesting/WebsiteTest/product-feautres.html

当我在此容器的顶部添加顶部边距时，它可以正常工作，但是当您调整大小并响应网站时却无法正常工作。谁能建议我解决此问题所需的更改？

最佳答案

尝试添加以下脚本

// If you put your code at the bottom of the page to avoid needing`$(document).ready`, it gets even simpler:

$(window).on('resize', function () {
    var newMarginTop = $('#header').height();
    $("#superContainer").css("margin-top", newMarginTop);
}).trigger('resize');


// Another way to do that same thing

$(document).ready(newMargin);
$(window).on('resize', newMargin);

function newMargin() {
    var newMarginTop = $('#header').height();
    $("#superContainer").css("margin-top", newMarginTop);
}


// Another technique is to`.trigger()`one event inside the other:

$(window).on('resize', function () {
    var newMarginTop = $('#header').height();
    $("#superContainer").css("margin-top", newMarginTop);
});
$(document).ready(function () {
   $(window).trigger('resize');
});