elixir/http/menu.css
2017-02-15 20:40:26 +01:00

64 lines
1.3 KiB
CSS

/* Hierarchical dynamic menu with CSS
*
* Copyright Petr Stanicek [aka -pixy-] 2003-05-16
*
* Taken from http://www.pixy.cz/blogg/clanky/csshiermenu/
*/
#menu {
position:relative;
list-style-type:none;
margin:0 0 0 0; padding:0;
width:100%; height:1.4em;
font:100%/1 sans-serif;
}
.menuitem {
position:absolute; top:-14px;
margin:0; padding:0;
width:10em; height:1.4em;
overflow:hidden;
}
#mi01 { left:6em }
#mi02 { left:16em }
#mi03 { left:26em }
.menuitem ul {
display:block;
margin: 0; padding:0;
list-style-type:none;
}
.menuitem li { margin:0; padding:0 }
.submenu li { position:relative }
/* 2-class selector to have higher weight than ".menuitem ul" */
.submenu .subsubmenu {
position:absolute; top:0; left:10em;
width:10em;
display:none;
}
#menu a,span {
display:block;
margin:0; padding: 0.2em 0.5em;
text-align:center;
text-decoration:none;
color:white;
border-top:1px solid #565F68;
border-left:1px solid #565F68;
cursor:pointer;
}
#menu a:hover { background:black }
.menuitem span { background:#565F68 }
.menuitem ul span { background:#88AA88 }
.menuitem ul ul a { background:#AA8888 }
.menuitem ul ul ul a { background:violet }
.menuitem ul ul ul ul a { background:orange }
#menu a,span {
border-bottom:none;
font-weight:bold;
}
html {
overflow-y:scroll;
}