[88mph]

Hi all

using an empty list element as a spacer at the top of a navigation, trouble is I can't seem to get it to not use the same :hover as the active nav elements. tried using multiple class's, but no joy


Mild Fuzz - Life in Soft Focus

[RaelRode]

Empty list? Why not just use margins?

[88mph]

its to do with the borders. it was a while ago i did it now, and can't quite remember, but I remember trying margins and padding and not getting the required effect

[88mph]

no one have an answer?

[StumpyXL]

If you are using borders and could not use margins, try using a border on the list not on the DIV. I did the exact same thing an was getting weird results with the class on the DIV.

[mattp]

How about this:

li.selected {
	border-top: 1px dotted black;
	margin-top: 40px;
}

li.selected.non-empty {
	margin-top: 40px;

}
.emptynav{
	height: 15px;
	display: none;
}
.emptysubnav{
	height: 5px;
	display: none;
}

It hides the empty li's you made, and uses margin-top along with a border for each of the newly top li's ('Home' on the left, 'About' on the right)

[pgo]

Why are you using :hover on the <li>s to begin with? Talk about confusing.

[LukeV]

Give the top <li> an id, so <li id="whatever">Home</li> and add a top border to the css?

[pgo]

Or add the top border to the <ul> and all the <li>s have a bottom border. That works also.