[RESOLVED] css navigation problem...

**thunder77** · 06-07-2006, 10:40 AM

I have a very simple list type navigation that I am getting a strange problem in. I've tried many things to remedy it and end up just screwing something else up every time. Can someone help me figure this out? The browser in question is IE6 on a pc... big surprise. You'll see it happenning right away on the left navigation. (i did not design this site BTW) www.bbfyale.com

Here's my CSS for the navigation on left.

HTML Code:

.sidenav ul {
	list-style-type: none;
	margin: 0px;
}
.sidenav li {
	list-style-type: none;
	margin: 0px;
	float:left;
	clear: left;
	width: 160px;	
	padding-bottom: 3px;
	padding-top: 2px;
	padding-right: 0px;
	padding-left: 0px;
}
.sidenav a:link, .sidenav a:visited {
	color: #FFFFFF;
	text-decoration: none;
	display: block;
	text-align:center;
}
.sidenav a:hover, .sidenav a:active {
	color: #336666;
	text-decoration: none;
	background-color: #FFCC33;
	text-align:center;
}

Thanks for any help!

**nataliemac** · 06-07-2006, 11:58 AM

Removing the float:left and clear: left declarations from the li element seems to have fixed it. I'm not really sure why those were there.

**thunder77** · 06-07-2006, 01:07 PM

tried that earlier... when I take those out it adds in some phantom padding on the left... check it out and you'll see what I mean... where is that coming from? I've put 0 margins and padding everywhere I could think it would be getting it from... thanks

**nataliemac** · 06-07-2006, 01:15 PM

I just noticed: You don't have a <ul> element to hold your <li>s!

Add that around your list and see if that helps.

Run your code through the W3C validator - there are some other issues there too. It's always best to start fixing layout from valid HTML.

**thunder77** · 06-07-2006, 01:18 PM

Thanks, that was the problem. I figured it was something dumb I was missing... this is a site that was existing, that I am now hosting and offered to help the navigation as a favor so I didn't want to spend much time and I got sloppy within sloppy code, which is obviously a train wreck waiting to happen... LOL thanks again.