My left-hand nav bar’s bottom is being cut off on shorter screens. I only just noticed it when working on my laptop screen. I’ve tried 100vh on two different containers without success. Any suggestions please? Thanks!
If you want to shrink it, then you need to shrink the content (icons, text, etc.)
Now your content is actually overflowing out of the div, so it is there, but it’s cut off.
The simplest way to fix this is to set the container of your menu to overflow:auto, this way it will scroll.
But for UX, I’d work on responsivness 
1 Like
Thanks @Broberto. I’m pretty familiar now with responsive design horizontally, I guess this is the first time I’ve had to deal with it vertically. I will experiment.
1 Like
I can’t figure this out. I’ve verfied that the height settings on both the Menu and Content elements are set the same as the out of the box side menu and yet when my content expands vertically, the side menu doesnt resize. Any suggestions please @Joyce or anyone else? Thanks! 
I went with making the left-hand nav scrollable and also set the top and bottom margins of the center section to adjust relative to the vh. Seems to work well enough. Is this considered good responsive design?
Yes, if you made the sidebar dynamically sized it would act weird on scroll
This is a good solution
2 Likes