    /* the key here is to create a reference block by setting ul to relative
        -- after that all child absolute blocks use that as the reference as defined in the css spec
        */
        /* the main menu */
        div.menu div {background-color:#ddddff;position:absolute;}
        div.menu div.file {position:absolute;top:10px;left:10px;width:110px;}
        div.menu div.edit {position:absolute;top:10px;left:130px;width:110px;}
        div.menu div > ul {display:none;}
        div.menu div:hover > ul {display:block;padding-left:20px;}
        
        /** the submenu */
		div.menu ul {position:relative;margin:0px;padding:0px;}
		div.menu li {position:relative;width:100px;display:block;}
        div.menu li:hover > ul {display:block;position:absolute;left:10px;top:0px;}
        div.menu ul ul {display:none;padding-left:40px;}
        /* just some coloring issues */
        
        div.menu li:hover, div.menu li:hover li:hover {background-color:blue;color:white}
        div.menu li:hover li {color:black;background-color:#ddddff;}
        
        
