Everything ‘pops up’ because you’ve got a height declaration in the hover attribute but not the original li
definition:
#nav li:hover {
background-color: #24389b;
height: 25px;
}
The problem with columns is almost certainly because you’ve got the left to float left and the right hand one to float right – as far as I can remember, it will probably work best if you set them both to float left (there are lots of tutorials on 2 column liquid CSS designs; you should be able to adapt one to your needs)
I agree with @Joseph for your link colour issue – that’s simple to fix.
solved Whats wrong with this CSS/HTML code? [duplicate]