0

I'm starting to look into bootstrap to make a layout for an app. I'm trying to make the left bar full height with the screen, making this the content will need to follow also.

I already try the height: 100% but's it's not working.

I place my code in JSFiddle please check, i really apreciate your help

[JSFiddle Code](https://jsfiddle.net/fhavio/448qcxg6/)

Fábio Rodrigues
  • 15
  • 5
  • did you try a clearfix, or is it more complex than that? – dandavis Feb 01 '17 at 21:59
  • Try something like this: http://codeply.com/go/1egwlFgOrD You should make the sidebar fixed so that scrolling the main content area allows it to remain 100% height. – Carol Skelly Feb 02 '17 at 00:00

3 Answers3

0

Move the left bar out of your .row, make it 100% high, and also give html and body `height: 100%;

https://jsfiddle.net/umb1kwp2/1/

Johannes
  • 64,305
  • 18
  • 73
  • 130
0

These units are vh (viewport height), vw (viewport width), vmin (viewport minimum length) and vmax (viewport maximum length).

 style="height:100vh;"

For more details click this answer

Community
  • 1
  • 1
Performer
  • 11
  • 6
0

You need to use css like that #leftBar { height: 100vh; }