How to avoid gap between Quick launch and footer in SharePoint 2013

Question

I have used this link for setting the footer, it's working fine. I do not want to change it.
I have provided some background color to quick launch, but when content is less than the page height, a gap appears in between the quick launch and footer, how can I avoid it. Please refer the below image:

Anyone having any idea, please share.

Thanks

Answer 1

That depends largely on your masterpage and your stylesheet. From your screenshot it looks almost as if the 35px bottom-padding of #s4-bodyContainer is causing this gap (assuming that this value in your stylesheet is not different from the default value).

You could try that:

#s4-bodyContainer { padding-bottom: 0 !important; }

Answer 2

I cannot say it as an answer, but it is a workaround that worked for me. here it is:

$( document ).ready(function() {
    $("#sideNavBox").css("height",$(".footer").position().top-$("#sideNavBox").position().top-40);
});