|
#1
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 08:07 AM
|
|
Hi you all,
I am trying to get the body (all the contents) to be always 100% in height.
That is to avoid what you can see in the attachment.
I guess this is not a very big deal but I can't seem to get it done!
Thanks a lot!
|
#2
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 09:32 AM
|
![Flynn's Avatar](image.php?u=1&dateline=1256758545) |
|
|
3,768 posts · Oct 2008
Munich, Germany
|
|
Add to the existing jQuery code in header.php, i.e. after
jQuery("ul.tw-nav-list").addClass("clearfix");
this:
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
jQuery('table#layout').css({height: windowheight + 'px'});
}
if you have padding, margin, borders around table#layout you may have to adjust the actual height being set for table#layout, i.e.
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
var targetheight = layoutheight - 30; /* div#wrapper - 2*15px for padding around table#layout */
jQuery('table#layout').css({height: targetheight + 'px'});
}
|
#3
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 10:07 AM
|
|
Hi Flynn,
Thanks a lot for the quick response.
Unfortunatelly it didn't work... Now, since I am not a programmer, I am never sure about what I do when it comes to coding!
So here goes the bit of header.php that I changed, just for you to check if it is ok:
jQuery("ul.tw-nav-list").addClass("clearfix");
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
jQuery('table#layout').css({height: windowheight + 'px'});
});
//-->
I checked and erased anything related with padding, margins and borders around table#layout. In any case I also tried the second version of your code with no success either.
Any other idea?
Thanks!
|
#4
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 10:17 AM
|
![Flynn's Avatar](image.php?u=1&dateline=1256758545) |
|
|
3,768 posts · Oct 2008
Munich, Germany
|
|
The closing bracket is missing
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
jQuery('table#layout').css({height: windowheight + 'px'});
}
|
#5
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 10:35 AM
|
|
Sorry Flynn, but still nothing changed...
Here is what I tried:
jQuery("ul.tw-nav-list").addClass("clearfix");
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
jQuery('table#layout').css({height: windowheight + 'px'});
}
//-->
</script>
<?php wp_h....
and
jQuery("ul.tw-nav-list").addClass("clearfix");
var windowheight = jQuery('window').height();
var layoutheight = jQuery('div#wrapper').height();
if ( windowheight > layoutheight ) {
jQuery('table#layout').css({height: windowheight + 'px'});
}
});
//-->
</script>
<?php wp_h....
Just in case I wasn't able to explain myself, I just uploaded an image... what you see on the left is how I see it now online... and what you see on the right is how I'd like it to be.
|
#6
![Old](images/bytesforall/statusicon/post_old.gif)
May 14, 2009, 05:33 PM
|
![Flynn's Avatar](image.php?u=1&dateline=1256758545) |
|
|
3,768 posts · Oct 2008
Munich, Germany
|
|
Try this, works for me:
// strech short pages to full height, keep footer at bottom
var windowheight = jQuery(window).height();
var headerheight = jQuery("td#header").height();
var footerheight = jQuery("td#footer").height();
var layoutheight = jQuery("div#wrapper").height();
if ( windowheight > layoutheight ) {
var newmiddleheight = windowheight - headerheight - footerheight - 43;
jQuery("td#middle").css({height: newmiddleheight + "px"});
}
|
#7
![Old](images/bytesforall/statusicon/post_old.gif)
May 15, 2009, 02:22 AM
|
|
Hi FLynn,
At this point I am starting to feel dumb, but... still couldn't make it work.
I am sending you the code you sent me, with the previous and following lines, just for you to see where I am inserting it...
jQuery("ul.tw-nav-list").addClass("clearfix");
// strech short pages to full height, keep footer at bottom
var windowheight = jQuery(window).height();
var headerheight = jQuery("td#header").height();
var footerheight = jQuery("td#footer").height();
var layoutheight = jQuery("div#wrapper").height();
if ( windowheight > layoutheight ) {
var newmiddleheight = windowheight - headerheight - footerheight - 43;
jQuery("td#middle").css({height: newmiddleheight + "px"});
}
//-->
</script>
|
#8
![Old](images/bytesforall/statusicon/post_old.gif)
May 15, 2009, 05:52 AM
|
![Flynn's Avatar](image.php?u=1&dateline=1256758545) |
|
|
3,768 posts · Oct 2008
Munich, Germany
|
|
You keep removing the last
});
Don't remove anything, just add the code I posted above
|
#9
![Old](images/bytesforall/statusicon/post_old.gif)
May 15, 2009, 07:22 AM
|
|
Sorry about that!
I did it as you said now and it seems to work fine in Firefox, but:
- it creates a vertical scrollbar in Safari
- it doesn't work in Opera
Everything in Mac.
If you want to check it out you can visit www.in-spire.biz/site/
Cheers!
|
#11
![Old](images/bytesforall/statusicon/post_old.gif)
Sep 9, 2009, 07:44 AM
|
|
v. Atahualpa 3.4.2
It appears that this didn't make it into the latest version.
How can I set a minimum height for all the entire theme?
Great theme, thanks.
|
#12
![Old](images/bytesforall/statusicon/post_old.gif)
Sep 15, 2009, 04:58 PM
|
![Flynn's Avatar](image.php?u=1&dateline=1256758545) |
|
|
3,768 posts · Oct 2008
Munich, Germany
|
|
Do you have Atahualpa Theme Options -> "Style and Edit Footer" -> Sticky Footer on short pages?
|
#13
![Old](images/bytesforall/statusicon/post_old.gif)
Sep 26, 2009, 11:18 AM
|
|
I think that was the only option in Atahaulpa 3.4.2 that I haven't messed with. It worked perfectly.
|
|