Hiya,
Many thanks in advance, I'm getting desperate! My website is driving me mad. Just as I thought I had fixed it, my dropdown seems to have stopped working. Clearly I did something to break it, and I've tried to retrace my steps but to no avail. Hence I'd very much appreciate some help!

Basically the problem was that the drop down menu worked fine in everything apart from IE (7, I haven't tested on other versions). The drop down appeared at the same height as the menu item and to the right, and disappeared so quickly you couldn't click on it.

So I inserted <br /> before the other list tag as described here and voila, it was perfect.

Then, I played around with some table sizing, and a few other things, and now it doesn't work.

The site is lizyong.com .
Please note it's only index.html that needs fixing, I haven't changed the other pages (e.g. portfolio-->polo, which incidentally shows how it was when I found it broken - I've fixed it a bit but not enough)

Also, in IE, the drop down box isn't quite wide enough for the text. I'm sure this was fine last night, but am not 100% sure. Have tried changing the width to 6.8 or 7 em but it looks bad in the other browsers.

Many many thanks,
Liz

How it should appear:
http://www.lizyong.com/problems/safari.png

CSS extract:
Code:
#nav, #nav ul {
	float:left;
	width: auto;
	list-style: none;
	line-height: 1;
	background: white;
	font-size: 0.9375em;
	font-weight: inherit;
	font-family: baskerville;
	padding: 0;
	border: solid #666666;
	border-width: 0px 0;
	margin: 1em 0 1em 0;
	#position: relative;
	#top: -25%;
	
}

#nav a {
	<!--nav menu top level-->
	display: block;
	width: auto;
	w\idth: auto;
	color: #000000;
	text-decoration: none;
	padding: 0.25em 0.6em;
	color: #000000;
}

#nav a:hover {
	color:#ff6633;
	text-decoration:none;
}


#nav li {
	float: left;
	padding: 0.25em 0.20em;
	width: auto;
	
}

#nav li ul {
	position: absolute;
	left: -999em;
	height: auto;
	
	width: 6.6em; <!--controls width of drop down-->
	w\idth: 6.6em;
	font-weight: normal;
	border-width: 0.10em;
	margin: 0.15em 0 0 0;
	color:#ff6633;
	
}

#nav li li {
	padding-right: 0em;
	width: 8.5em;
}

#nav li ul a {
	<!--first and second level menu links-->
	width: 7.5em;
	w\idth: 7.5em;
	color: #000000;
}

#nav li ul ul {
	margin: -1.30em 0 0 7.50em;
	color: #ff6633;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {
	left: -999em;
	color:#ff6633;
	text-decoration:none;
	color:#ff6633;
}

#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {
	left: auto;
	color:#ff6633;
	text-decoration:none;
}


#content {
	clear: left;
	color: #ccc;
}