Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Mark Shaw
Mark Shaw
10,449 Points

Having problem with height of a div (not full page height under certain circumstances)

Hi everyone!

I'm coding a little practice page just to practice a few simple things and I'm having a problem.

I have two columns. One of them (or possibly both I haven't checked) Won't span the full height of the page when viewed at certain viewport widths/heights. It's driving me crazy! I'm sure it's some simple thing I don't know how to do or am overlooking but I can't figure it out.

Here's a link to the code on codepen :

http://codepen.io/anon/pen/OPyLQy

I first noticed it when checking out the page in chrome dev tools emulating an iphone 6 display.

Any help would be great. Thank you!

1 Answer

Nathan Brown
Nathan Brown
229 Points
Nathan Brown
Nathan Brown
229 Points

Mark,

You may want to look here for a discussion of problems with rendering viewport height in IOS:

http://www.weareconvoy.com/2014/07/24/css-vw-and-vh-units-are-they-worth-using-yet/

JavaScript fallbacks are recommended.

Also see the discussion here with more JavaScript fallback examples:

https://github.com/scottjehl/Device-Bugs/issues/36

Mark Shaw
Mark Shaw
10,449 Points

Thanks for the help!