I am trying to create a website. I have created a vertical drop down menu but when I hover my mouse on the menu the sub items doesn’t show up perfectly — the sub menus appears to go behind my content area (please check the image below).

But if I remove the content, the menu shows up correctly. It looks like following:

I have pasted all the codes in http://jsfiddle.net/SxWbD/2/ .
Would you please kindly tell me where I am doing wrong?
Thanks in Advance 🙂
just give your #sidebar – z-index:10;
http://jsfiddle.net/SxWbD/3/