Hi, i am styling a navigation menu using the following css. I have found that it works perfectly in chrome but absolutely none of the css is beign applied in firefox or IE.

Is there something obvious that i havent done or have done here?

<style type="text/css">
    #ddm {
         margin: 0;
         padding: 0;
    }           
    #ddm li {
        float: left;
        list-style: none;
        font: 8pt Tahoma, Geneva, sans-serif;
    }
    #ddm li a {
        display: block;
        padding: 5px 12px;
        text-decoration: none;
        border-right: 1px solid white;
        width: 70px;
        white-space: nowrap;
        color:Red;
        border: none;
    }           
    #ddm li a:hover {
        color:White;
        background-color:#444444;
    }
    #ddm li ul {
        margin: 0;
        padding: 0;
        position: absolute;
        visibility: hidden;
    }           
    #ddm li ul li {
        float: none;
        display: inline
    }           
    #ddm li ul li a { width: auto; }            
    #ddm li ul li a:hover { }
</style> 


    <ul id="ddm">
        <li>
            <ul>
                <li><a href="#">test 1</a></li>
                <li><a href="#">test 2</a></li>
            </ul>
        </li>
    </ul>