Change Submenu direction

[ballouta]

Hello

I have this CSS menu and i cant find the css code that changes the submenu to open on the left side instead of the right side

 

This is the css code I have:

 

#nav_container {
width: 940px;
margin: 0 auto;
}
#nav {
font-family: Tahoma;
font-weight: bold;
font-size: 11px;
color: #9f9f9f;
z-index: 9999;
float: right;
position: relative;	
}
#nav, #nav ul{
     margin:0;
     padding:0;
     list-style-type:none;
     list-style-position:outside;
     position:relative;
     line-height:0.6em;
}
#nav a:link, #nav a:active, #nav a:visited{
    display:block;
    padding: 14px 25px;
    color:#a5a5a5;
    text-decoration:none;
text-transform: uppercase;
}
#nav a:hover {
    color:#fff;
}
#nav .on{
background: url(../images/hover.png) no-repeat center;
height: 12px;
color:#fff !important;
float: left;
position: relative;
}
#nav .subscribe{
background: url(../images/subscribe.png) top left no-repeat;
height: 12px;
margin-left: 22px;
float: left;
position: relative;
}
#nav li{
    float:left;
    position:relative;
}
#nav ul {
    position:absolute;
    top:2.9em;
    display:none;	
z-index: 1;
}
#nav li ul a {
    width:8em;
    float:left;
background-color: black;
background-image: none !important;
}
#nav li ul a:hover {
background-color: #292929;
}
#nav ul ul{
top:auto;
}	
#nav li ul ul {
    left:11.3em;
    margin:0px 0 0 10px;
}
#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
    display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
    display:block;
}

 

please help

many thanks

 

[attachment deleted by admin]

[joePHP]

Hi,

 

Can you please post the HTML code.

 

Thanks,

Joe

 

[ballouta]

Thanks Joe

here's the HTML

<!-- Nav container -->
<div id="nav_container">

<!-- Nav -->
<ul id="nav">
	<li><a class="on" href="#">home</a></li>
	<li><a href="about.html">about</a>
	<ul>
		<li><a href="about.html">company</a></li>
		<li><a href="about.html">team member</a>
		<ul>
			<li><a href="about.html">member one</a></li>
			<li><a href="about.html">member two</a></li>
			<li><a href="about.html">member three</a></li>
			<li><a href="about.html">member four</a></li>
		</ul>
		</li>
	</ul>
	</li>
	<li><a href="portfolio.html">portfolio</a>
	<ul>
		<li><a href="portfolio.html">design</a>
		<ul>
			<li><a href="portfolio.html">website</a></li>
			<li><a href="portfolio.html">identity</a></li>
		</ul>
		</li>
		<li><a href="portfolio.html">illustrations</a></li>
		<li><a href="portfolio.html">photography</a></li>
	</ul>
	</li>
	<li><a href="blog.html">blog</a>
	<ul>
		<li><a href="blog.html">category one</a></li>
		<li><a href="blog.html">category two</a></li>
	</ul>
	</li>
	<li><a href="contact.html">contact</a></li>
	<li><a class="subscribe" href="#">subscribe</a></li>
</ul>
<!-- // Nav -->