CSS Positioning Issues: Wordpress

Question

I'm following this tutorial here http://www.kriesi.at/archives/create-a-multilevel-dropdown-menu-with-css-and-improve-it-via-jquery on adding a menu with jquery.

I've created my menu, but I'm having trouble adding it to wordpress. I opened up the header.php file since I want it to appear below the banner, and I paste it in it's own div, but it always "pushes" everything below it to the right.

How do I stop it from doing this?

Here's the code:

<ul id="nav">
<li><a href="#">1 HTML</a></li>
<li><a href="#">2 CSS</a></li>
<li><a href="#">3 Javascript</a>
    <ul>
        <li><a href="#">3.1 jQuery</a>
            <ul>
                <li><a href="#">3.1.1 Download</a></li>
                <li><a href="#">3.1.2 Tutorial</a></li>
            </ul>
        </li>
        <li><a href="#">3.2 Mootools</a></li>
        <li><a href="#">3.3 Prototype</a></li>
    </ul>
</li>

Answer 1

Hard to say without looking at the whole, but based on knowing very little of your problem, the only thing I can recommend you to try is this CSS property:

ul#nav {
    position: absolute;
}

This way, it will not push other elements away. It might have other consequences tough, depending on other elements you might have.

Answer 2

Looks like you're missing a closing </ul>? You can also use The W3C Markup Validation Service to tack down errant tags.