How to adjust positioning of a flyout menu to keep it on the screen

HI,

Add his:


html,body{height:100%;margin:0;padding:0}
#outer_div{height:100%}
#sidebar,#main{vertical-align:top}

You need the html and body elements at 100% so that you can base the outer on that height. (100% height is safe here because you are using display:table where height is treated as a minimum. You cannot use this approach on normal divs that are not display:table.)