"
Template:Caltech Menubar
From 2012.igem.org
(Difference between revisions)
| Line 104: | Line 104: | ||
/************************************************************/ | /************************************************************/ | ||
/* Main menu settings */ | /* Main menu settings */ | ||
| - | # | + | #nav { |
clear:both; | clear:both; | ||
float:left; | float:left; | ||
| Line 118: | Line 118: | ||
/* Top menu items */ | /* Top menu items */ | ||
| - | # | + | #nav ul { |
margin:0; | margin:0; | ||
padding:0; | padding:0; | ||
| Line 126: | Line 126: | ||
right:50%; | right:50%; | ||
} | } | ||
| - | # | + | #nav ul li { |
margin:0 0 0 1px; | margin:0 0 0 1px; | ||
padding:0; | padding:0; | ||
| Line 134: | Line 134: | ||
top:1px; | top:1px; | ||
} | } | ||
| - | # | + | #nav ul li a { |
display:block; | display:block; | ||
margin:0; | margin:0; | ||
| Line 146: | Line 146: | ||
border-bottom:1px solid #000; | border-bottom:1px solid #000; | ||
} | } | ||
| - | # | + | #nav ul li.active a { |
color:#fff; | color:#fff; | ||
background:#000; | background:#000; | ||
} | } | ||
| - | # | + | #nav ul li a:hover { |
background:#36f; /* Top menu items background colour */ | background:#36f; /* Top menu items background colour */ | ||
color:#fff; | color:#fff; | ||
border-bottom:1px solid #03f; | border-bottom:1px solid #03f; | ||
} | } | ||
| - | # | + | #nav ul li:hover a, |
| - | # | + | #nav ul li.hover a { /* This line is required for IE 6 and below */ |
background:#36f; /* Top menu items background colour */ | background:#36f; /* Top menu items background colour */ | ||
color:#fff; | color:#fff; | ||
| Line 163: | Line 163: | ||
/* Submenu items */ | /* Submenu items */ | ||
| - | # | + | #nav ul ul { |
display:none; /* Sub menus are hiden by default */ | display:none; /* Sub menus are hiden by default */ | ||
position:absolute; | position:absolute; | ||
| Line 171: | Line 171: | ||
width:10em; /* width of the drop-down menus */ | width:10em; /* width of the drop-down menus */ | ||
} | } | ||
| - | # | + | #nav ul ul li { |
left:auto; /*resets the left:50% on the parent li */ | left:auto; /*resets the left:50% on the parent li */ | ||
margin:0; /* Reset the 1px margin from the top menu */ | margin:0; /* Reset the 1px margin from the top menu */ | ||
| Line 177: | Line 177: | ||
width:100%; | width:100%; | ||
} | } | ||
| - | # | + | #nav ul ul li a, |
| - | # | + | #nav ul li.active li a, |
| - | # | + | #nav ul li:hover ul li a, |
| - | # | + | #nav ul li.hover ul li a { /* This line is required for IE 6 and below */ |
font-size:.8em; | font-size:.8em; | ||
font-weight:normal; /* resets the bold set for the top level menu items */ | font-weight:normal; /* resets the bold set for the top level menu items */ | ||
| Line 188: | Line 188: | ||
border-bottom:1px solid #ddd; /* sub menu item horizontal lines */ | border-bottom:1px solid #ddd; /* sub menu item horizontal lines */ | ||
} | } | ||
| - | # | + | #nav ul ul li a:hover, |
| - | # | + | #nav ul li.active ul li a:hover, |
| - | # | + | #nav ul li:hover ul li a:hover, |
| - | # | + | #nav ul li.hover ul li a:hover { /* This line is required for IE 6 and below */ |
background:#36f; /* Sub menu items background colour */ | background:#36f; /* Sub menu items background colour */ | ||
color:#fff; | color:#fff; | ||
| Line 197: | Line 197: | ||
/* Flip the last submenu so it stays within the page */ | /* Flip the last submenu so it stays within the page */ | ||
| - | # | + | #nav ul ul.last { |
left:auto; /* reset left:0; value */ | left:auto; /* reset left:0; value */ | ||
right:0; /* Set right value instead */ | right:0; /* Set right value instead */ | ||
| Line 203: | Line 203: | ||
/* Make the sub menus appear on hover */ | /* Make the sub menus appear on hover */ | ||
| - | # | + | #nav ul li:hover ul, |
| - | # | + | #nav ul li.hover ul { /* This line is required for IE 6 and below */ |
display:block; /* Show the sub menus */ | display:block; /* Show the sub menus */ | ||
} | } | ||
| - | |||
</style> | </style> | ||
Revision as of 03:07, 19 September 2012
