Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Full Page design: How to force a Div to stop expanding at the bottom of the page Re: Full Page design: How to force a Div to stop expanding at the bottom of the page

#111039
TaSki
Member

Hi @wolfcry911 thanks a lot for your answer. I think that the use of some jQuery is inevitable. Your jQuery works great expect for the fact that it doesn’t change “top” when the viewer re-size its browser window horizontally.

In the mean time I also had some help from someone else who also thought that jQuery had to be used and he ended with these JS lines that work with horizontal and vertical resizing of the browser window:

$(document).ready(function() {
max = $(document).height() - $('#bottom-inside-container').offset().top;
$('#bottom-inside-container').css('max-height',max);
});

$(window).resize(function() {
max = $(document).height() - $('#bottom-inside-container').offset().top;
$('#bottom-inside-container').css('max-height',max);
});

Here is the end result.

Thanks again and unless a solution without jQuery exists this problem is solved :).