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!

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

HTML

Posted by Graham Davidson
Graham Davidson
Courses Plus Student 14,966 Points

Img 100% height

Morning All

I want to create a full height image of a Div - I am using 100% height on html and body etc and this creates 100% height of the viewport but what I am looking for is 100% height of the browser window. As if I open the attached site with Dev tools open it all goes a bit wrong.

http://www.justg.co.uk/b5/

2 Answers

Dmitriy Simberev
Dmitriy Simberev
926 Points
Dmitriy Simberev
Dmitriy Simberev
926 Points

May be... .colTwo img { width: auto; height: 100%; background-size: cover; }

Michael Trilford
Michael Trilford
7,232 Points

Pretty sure it has to be a background image for that to work.

Michael Trilford
Michael Trilford
7,232 Points
Michael Trilford
Michael Trilford
7,232 Points

.colTwo { background: url('img/mainImage.jpg') 0 0 no-repeat; background-size: cover; }

This is the easiest solution I think.