How to design a frozen left navigation column for vertical scrolling?

as in Google news or pulsme land pages. Obviously, the main advantage of this being when user scrolls down in the main document, the navigation-menu is still remains visible the screen. I tried position:fixedfor the <td> element. But the problem is that when the page is viewed on a mobile device (small screen) the text mixes with the main content. I am okay with the solution which is not table but preferably should not use any external libraries. I also tried <iframe>… but could not get it running. Thanks!

Answer

The best solution would be to add a menu in a div and the content in another

<div id="menu">Some Menu Options</div>
<div id="cont">Your Content</div>

Then in CSS

#menu {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 150px;
}
#content {
  position: relative;
  margin-top: 100%;
}

Off course you could replace 150px with any other value.