Two Sub Navs on CSS drop down menu?

Website: www.neverup-neverin.com

As you can see I have a drop down menu as my navigation bar that has been created using CSS.

I want to be able to have a several children under “Bottle Cottages” which is a child to Properties.

I have tried to create a sub nav under Bottle Cottages but when I do so it gets rid of the other child (called “Stonehouse Lane”) When I roll the mouse over “Properties”

Am I doing something wrong or is this not possible?

Thanks in advance

Hi,
I assume you want something like this:

Add this code after the original navbar rules.


.navbar ul.subnav ul{
	position:absolute;
	margin-left:-999em;
	left:100%;
	top:-1px;
}
.navbar ul.subnav li:hover ul{margin-left:0}



<div class="navbar">
		<ul>
				<li><a href="#">Home</a> </li>
				<li><a href="#">Properties</a>
						<ul class= "subnav">
								<li><a href="#">Bottle Cottages</a>
										[B]<ul>
												<li><a href="#">More links</a></li>
												<li><a href="#">More links</a></li>
												<li><a href="#">More links</a></li>
												<li><a href="#">More links</a></li>
												<li><a href="#">More links</a></li>
												<li><a href="#">More links</a></li>
										</ul>[/B]
								</li>
								<li><a href="#">Stonehouse Lane</a></li>
						</ul>
				</li>
				<li><a href="#">About</a></li>
				<li><a href="#">Contact</a> </li>
		</ul>
		<p> tel: 07791677146 e-mail: mikelister@gmail.com </p>
</div>


The new subnav will appear at the side of the trigger item which is the usual way to do this. You don’t want it appearing underneath the sub item because that makes navigation nigh impossible.

That works exactly how I wanted it to, thanks very much

Happy New Year!