Question

I have
this:

Now, I want two things… Left div (navigation) I want border all the way to the bottom.
Second, I want content inside #content div and footer must be after it.

Why does the content go allway to the content and footer?

Thank you.

EDIT:

CSS:

 #header { padding: 0px; color: #000; background: #fff;}
  #topnav { color: #aaa; background: transparent; position: inherit;}
  #main { margin: 10px 0; background: #fff;  height: 50%;}
  #footer { padding: 10px 0px 10px 0px; margin-top: 25px; color:#666; background: #f9f9f9; border-top: 5px #efefef solid; }

  #col1 { float: left; width: 13%;}
  #col2 { display:none}
  #col3 { width: auto; margin: 0 0 0 15%}
  #col1_content { padding: 0 10px 0 20px;}
  #col3_content { padding: 0 20px 0 10px;}
  #col1 { border-right: 5px #ddd ridge }

Answer 1

place your footer with absolute positioning so it gets anchored to the very bottom like all footers should be unless you have something different in mind.

#footer { position:absolute; bottom: 0px; left: 0px; }