I use this on my site (using PlatformPro), but it doesn't work on yours...
Not sure why... but have a play around with it. 
White space at bottom of big screens
Started by
jkskovgaard
, Mar 01 2013 06:32 PM
Best Answer bluecloud , 19 March 2013 - 01:42 PM
Thank for the fix Mr. Powers! Just what I needed.
Although it wasn't working ok in first place. I made a few changes to make it work:
<script> /* <![CDATA[ */
!function ($) {
jQuery(document).ready(function() {
var myWindowHeight = $(window).height() // window height
, mySelector = '.section-content-area > .texture > .content'
// ^^ what you're setting to window height (play with this)
$(mySelector).css('min-height', myWindowHeight) //<-- changed from myBodyHeight
// If you want to run this on browser window resize as well
$(window).resize(function() {
var myBodyHeight = $('body').height()
$(mySelector).css('min-height', myBodyHeight) // <-- changed from myWindowHeight
});
}) }(window.jQuery); /* ]]> */ </script>
Go to the full post 
32 replies to this topic
#21
Jenny
-
- Moderators
-
- 2,817 posts
Owned by PageLines
- LocationWV
-
Country:
Posted 06 March 2013 - 08:16 PM
#22
jkskovgaard
-
- Members
- 48 posts
Advanced Member
-
Country:
Posted 06 March 2013 - 08:35 PM
Thank you Jenny - don't see how setting a negative margin will solve the stretch to 100% height issue though?
#23
Jenny
-
- Moderators
-
- 2,817 posts
Owned by PageLines
- LocationWV
-
Country:
Posted 07 March 2013 - 04:53 AM
On my site, it isn't a non-100% issue, it's a hidden padding/margin somewhere. The code above has worked on all of my PlatformPro sites to get rid of the extra spacing but I'm not sure why it isn't working on your site.
#24
jkskovgaard
-
- Members
- 48 posts
Advanced Member
-
Country:
Posted 07 March 2013 - 08:29 PM
Ok, thank you Jenny - but do you understand what my trouble is? I'm trying to make the content area stretch all the way to the bottom of the screen. It doesn't do that unless you have content tall enough for it to do so.
Unlike the default 100% width setting it isn't possible to set a 100% height property, as far as I can see.
I think what you're talking about is the couple of pixels black space at the top and bottom that you'd normally get on a platformpro site. But if you look at my test-site I don't have that:
#25
James B
-
- Moderators
-
- 2,417 posts
Advocate
- LocationSurrey - UK
-
Country:
Posted 08 March 2013 - 12:33 AM
Just an update to let you know this has been emailed over to get some more info from the core team, haven't had a response to confirm yet, but people are having a look into it. As soon as I know abit more I'll let you know.
#26
jkskovgaard
-
- Members
- 48 posts
Advanced Member
-
Country:
Posted 08 March 2013 - 03:31 PM
Thank you James, hope they'll figure it out!
#27
James B
-
- Moderators
-
- 2,417 posts
Advocate
- LocationSurrey - UK
-
Country:
Posted 09 March 2013 - 04:49 AM
I'll have some form of answer/update to this on Monday, will keep you posted
#28
jkskovgaard
-
- Members
- 48 posts
Advanced Member
-
Country:
Posted 12 March 2013 - 07:09 PM
Tuesday Bump!
#29
James B
-
- Moderators
-
- 2,417 posts
Advocate
- LocationSurrey - UK
-
Country:
Posted 13 March 2013 - 12:25 AM
Have Dm'd you. Still working on this. Will have an answer shortly, had to go further up the command chain to get more info :-)
#30
arpowers
-
- Administrators
-
- 3,214 posts
Founder
- LocationSan Francisco, CA
- Framework Version:2.3
-
Country:
Posted 14 March 2013 - 08:25 PM
Alright, @James called me in on this one..
This is a particularly challenging problem in pure CSS as CSS doesn't allow 'height: 100%' in content based context.
Therefore, i'm going to recommend adding a little bit of Javascript as a quick fix.
Add this to your headerscripts option, and note that it is untested, but at least close to what you're looking for. (let us know if it doesn't work)
You may have to play with selectors, etc... It essentially get the window height, and sets something else to that height.
#31
jkskovgaard
-
- Members
- 48 posts
Advanced Member
-
Country:
Posted 16 March 2013 - 08:05 PM
Erhm... Mr. Powers, thank you for getting back to me here. But seriously? Javascript?
I replaced the Pagelines Theme with the naked Toolbox theme and set up a few css rules. ...And made the #content stretch to the bottom of the screen in like 5 seconds. Ok, minutes, but who's counting.
Please have a look:
Obviously it's possible to call height:100% in CSS. The problem in Pagelines (I think) is that there are so many surrounding containers and that we'd have to set the height property in each and everyone.
But it should most definitly be possible without Java I'm very sure??
Cheers,
Jens.
#32
Danny
-
- Moderators
-
- 7,482 posts
Ninja
- LocationManchester, UK
-
Country:
Posted 17 March 2013 - 09:32 AM
Its most likely possible with CSS and CSS only, but like Andrew mentions above, its going to be very tricky due to the layout of PageLines Framework, if you wish to give this attempt with CSS, you're free to do so.
If you require some assistance, I recommend contacting one of our Pros. -
#33
bluecloud
-
- Members
- 34 posts
Advanced Member
-
Country:
Posted 19 March 2013 - 01:42 PM Best Answer
Thank for the fix Mr. Powers! Just what I needed.
Although it wasn't working ok in first place. I made a few changes to make it work:
