Geek asks and answers

CSS: How to set the correct edge so that the parent of the element becomes visible in this example?

While searching for a keyboard-accessible menu, I came across this question , which has a CSS drop-down menu http://jsfiddle.net/cfWpE/ in its answer . It seems that using styles is anchored in the menu, and not :hoveron the elements <ul>, to display submenus without Javascript, but I cannot figure out how to do this.

Can someone better than me in CSS explain how this works? I would like to try to extend this to a three-level menu, but without understanding how it works on two levels, it will be difficult.

edited for clarity:

This is actually not a keyboard that bothers me; I understand that tabs are through updates :focusin the current focus link, but the only CSS rule that seems to apply to these elements is

ul.menu li.list a.category:hover,
ul.menu li.list a.category:focus,
ul.menu li.list a.category:active {
    margin-right:1px;
    background: black;
}

I do not understand how the 1-pixel margin-right parameter makes the parent <li>visible.

+5
source share
1 answer

This is an interesting technique for creating a dropdown menu.

.list margin-top 250px. . a.category - , , . a.category ul.submenu float:left. , . ( , "" ). (a.category ul.submenu) 125px li, 250px, 1px. - TADA: -D

, - , ;)

- css- display:block; hide. , top 0 , .

, . , blackhat SEO . , Google ,

+16

More articles:


All Articles