The easiest solution is to enclose both #slideshow and #menu in a <div> set to:
position:relative; top:0; left:0; height:250px;
to give them both the same vertical boundary within a box that will reserve sufficient vertical area on the page for both of them. Then set both #slideshow and #menu to margin:0; and adjust their 'top' and 'left' positions as needed.
In the future, you'll save yourself a lot of time and effort if you'd just learn how absolute positioning really works. There are tons of tutorials out there to choose from.
And learn how to use tools like the F12 Developer tools built into Internet Explorer or the Web Developer extension for Firefox and Chrome. They'll show you the bounding boxes of the various elements so you can see how the browser is interpreting your code and give you visible clues to solving problems like this in no time. Trial-and-error just takes too long, and unless you understand the basics you're apt to create lots of maintenance problems that won't be apparent until you try to change the page.