I am ironing out the final bugs in my website's CSS, and came across a problem on small screens, and when the web browser window is very short.
If the sidebar menu is too tall, i.e. if it were to have eight or so items, it actually protrudes through the top of the web page (invisibly, of course) and hides the first few items.
The website can be found here: www.probabilitywolf.com (It is currently live on the internet.)
Does anyone have any ideas relating to how I can fix this? It is the only problem I am having with the site. Sorry for not including any code, but the CSS file is quite big and I'm not entirely sure which part is responsible. The file can be found here: The style.css file. It will be great to (hopefully) learn how to iron out this final problem!
your sidebar has position absolute and bottom:35px. so no matter how big (or small) the screen is - it will be on 35px from bottom. other than that - i don't know have you seen your page in chrome - but it doesn't look as in firefox.
edit: try adding min-height property to parent of your navigation div.
i see that as the easiest solution here (the only problem is that it's not dynamic - in case you need it to be play with js a bit =) )
let's say something like this:
.side{
min-height: 300px;}