At this moment, my approach involves utilizing jQuery to position specific elements in relation to the window's size. While this method is effective when the window is at its full size, it encounters issues when dealing with a debugger that's open or a smaller window, resulting in a flawed layout.
Question: Is there a way to position elements relative to the maximum potential window height rather than the current window height?
jQuery
var navbarHeight = parseInt($(".navbar").css("height"));
$("#home-part-1").css("height", $(window).innerHeight() - navbarHeight);
$("#home-part-2").css("height", $(window).innerHeight());
$("#home-part-3").css("height", $(window).innerHeight());
$("#divider-1").css("top", $(window).innerHeight() - navbarHeight);
$("#divider-2").css("top", (2 * $(window).innerHeight()) - navbarHeight);