Hi All,

I have built a persistent dropline menu with two levels using only CSS. It is pretty standard.

It is a nested set of UL's and the UL's :hover state is what shows and hides the sub menu levels.

Something like this:

| *Pets* | Colors | Cars |
| Cats | Dogs | Birds| Goats | Sheep | 


| Pets | *Colors* | Cars |
| Red | Orange | Green | Blue| Yellow |

I then added a 1px border at the bottom of the first level UL element. Like this:

| *Pets* | Colors | Cars |
--------------------------------------
| Cats | Dogs | Birds| Goats | Sheep | 

When I hover over a first level item (Pets), and then move the mouse down to the second level (Cats), the entire second level disappears.

I finally figured out that the UL's 1px border is not included in the hover area for the UL.

Can I add a border to the bottom of a dropline menu level without messing up the menu hovering?

Thanks!