Team:Calgary/TestPageNavCSS
From 2013.igem.org
(Created page with "#NavHeight { height: 87px; } #TopBar { background: #000000; width: 100%; height: 87px; z-index: 10; position: fixed; } #TopBar ul { background: #000000; list-style: non...") |
|||
Line 1: | Line 1: | ||
#NavHeight { | #NavHeight { | ||
height: 87px; | height: 87px; | ||
+ | top: 25px; | ||
} | } | ||
Line 9: | Line 10: | ||
z-index: 10; | z-index: 10; | ||
position: fixed; | position: fixed; | ||
+ | top: 25px; | ||
} | } | ||
Revision as of 21:58, 16 August 2013
- NavHeight {
height: 87px; top: 25px; }
- TopBar {
background: #000000; width: 100%; height: 87px; z-index: 10; position: fixed; top: 25px; }
- TopBar ul {
background: #000000; list-style: none; position: relative; display: inline-table; padding: 0; margin: 0; }
- TopBar ul:after {
content: ""; clear: both; display: block; }
- TopBar li {
float: left; width: 124px; text-align: center; }
- TopBar li:hover > a {
text-decoration: underline; }
- TopBar a {
display: block; width: 100%; height: 100%; padding: 15px 0; color: #FFFFFF; text-decoration: none; font: 24px Raleway, Arial, san-serif; }
- TopBar > #TopLvlNav > li > a {
padding: 29px 0; }
- TopBar ul ul {
display: none; background: #000000; padding: 0; position: absolute; top: 99%; z-index: 10; }
- TopBar ul li:hover > ul {
display: block; }
- TopBar ul ul li {
float: none; position: relative; }
- TopBar ul ul a {
font-size: 20px; }
- TopBar ul ul ul {
position: absolute; left: 100%; top: 0; }
@-webkit-keyframes rotate {
from { -webkit-transform: rotate(0deg); } to { -webkit-transform: rotate(59deg); }
}
- TopBar #LogoItem:hover > img {
-webkit-animation-name: rotate; -webkit-animation-duration: .5s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: linear;
}
- TopBar #LogoItem {
padding: 8px 0; } /*
- TopBarCollapse {
width: 120px; height: 60px; background: orange; position: relative; }
- TopBarCollapse:after {
content: ""; clear: both; display: block; }
- TopBarCollapse ul {
display: none; list-style: none; padding: 0; }
- TopBarCollapse ul:after {
content: ""; clear: both; display: block; }
- TopBarCollapse:hover > ul {
display: block; }
- TopBarCollapse li:hover > ul {
display: block; }
- TopBarCollapse li {
float: left; display: block; clear: both; width: 120px; padding: 10px 15px; background: green; }
- TopBarCollapse li:hover {
background: pink; }
- TopBarCollapse a {
color: #FFFFFF; display: block; text-decoration: none; }
- TopBarCollapse #LogoItem {
display: none; }*/