I am working on a website and I want to have a navigation bar that is set to the bottom right hand corner of a DIV. I have gotten it in place, however, every time I hover over a button a weird glitch occurs that places the hover'ed buttom to the very right position. I can't seem to figure out a solution to this issue (whatever I do needs to be IE friendly). 

Tested in Chrome, FF, and Safari. All the same.

```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style>

#head {
    width: 80%;
    height: 80px;
    position:relative;
    margin-left:auto;
    margin-right:auto;
    background: #56A0D3;
    background-image:url(/image/bubblesTall.gif);
    z-index: 5000;
    padding-top:5px;
    color: #FFFFFF;
}

.menu {
    float:right;
    width:80%;

    position:absolute;
    bottom:0px;
    right:0px;
    margin-right:0px;
    text-decoration:none;
    height:auto;
}
.menu li {
    float:right;
    text-decoration:none;
    list-style-type:none;
}

#nav a:hover,
#nav a:focus {
    color:#ffffff;
    background:#009999;
    text-decoration:none;
    font-size: 14px;
    right: 0px;
    bottom: 0px;
    position: absolute;
}

.menu a {
    float: left;
    display:block;
    text-align:center;
    color: #5ccccc;
    background: #006363;
    font-size: 12px;
    font-weight:200;
    text-decoration:none;
    font-size: 14px;
    position:relative;
    padding-left:5px;
    padding-right:5px;
}

</style>
</head>

<body>
<div id="head">logo
<div class='menu'>

       <ul id="nav">
          <li><a href="index.html">Home</a></li>
          <li><a href="about.html">About Us</a></li>
          <li><a href="gallery.html">Gallery</a></li>
          <li><a href="programs.html">Programs</a></li>
          <li><a href="prospective.html">Prospective Clients</a></li>
          <li><a href="contact.html">Contact Us</a></li>
      </ul>

</div>
</div>

</body>
</html>

```