Header
From 2013.igem.org
(Difference between revisions)
Line 3: | Line 3: | ||
<style> | <style> | ||
/*---- CROSS BROWSER DROPDOWN MENU ----*/ | /*---- CROSS BROWSER DROPDOWN MENU ----*/ | ||
- | + | #gumax-nav { display: block; margin: 0; padding: 0; position: relative; } | |
- | + | #gumax-nav li { display: block; list-style: none; margin: 0; padding: 0; float: left; position: relative; } | |
- | + | #gumax-nav a { display: block; font-family: 'Trebuchet MS', Georgia, Verdana, Sans-serif, Arial; font-size: 110%; text-decoration: none; } | |
- | + | #gumax-nav ul { display: none; position: absolute; left: 0; margin: 0; padding: 0; z-index: 900; } | |
- | + | * html #gumax-nav ul { line-height: 0; } /* IE6 "fix" */ | |
- | + | #gumax-nav ul a { zoom: 1; } /* IE6/7 fix */ | |
- | + | #gumax-nav ul li { float: none; } | |
- | + | #gumax-nav ul ul { top: 0; } | |
- | + | ||
- | + | ||
- | + | ||
+ | /* heading style */ | ||
+ | #gumax-nav li a#gumax-nav-heading { font-size: 150%; } | ||
+ | #gumax-nav ul li span { padding: 3px 5px; } | ||
+ | |||
+ | /* Essentials */ | ||
+ | #gumax-nav ul { width: 100%;} | ||
+ | #gumax-nav ul ul { left: 201px; padding-bottom: 20px; } | ||
+ | /* theming */ | ||
+ | /*#gumax-nav { height: 29px; background: #333; border-top: 1px solid #c7c7c7; border-bottom: 1px solid #e7e7e7;}/**/ | ||
+ | #gumax-nav { height: 45px; background: darkturquoise; } /* HERE I CHANGE COLOR OF DROP DOWN */ | ||
+ | #gumax-nav *:hover { background-color: none; } | ||
+ | |||
+ | #gumax-nav a { | ||
+ | font-weight: bold; | ||
+ | color: #333; /* HERE I CHANGE COLOR OF LETTERS OF DROP DOWN*/ | ||
+ | padding: 10px 10px; | ||
+ | line-height: 1; | ||
+ | } | ||
+ | |||
+ | #gumax-nav li.hover a, #gumax-nav ul li, #gumax-nav ul li a { background-color: transparent; /* drop down background */ } | ||
+ | #gumax-nav ul { top: 30px;} /*drop down Y position*/ | ||
+ | #gumax-nav ul li a { font-weight: normal; color: black; padding: 6px 10px; /* white-space: nowrap; /* wrap long item */ } | ||
+ | #gumax-nav a.hover, #gumax-nav ul a.hover { background-color: none; color: #fff; } | ||
+ | #gumax-nav ul { border: none; opacity: 100.0; filter: alpha(opacity=100.0); } | ||
+ | </style> | ||
<body> | <body> | ||
- | <ul id="nav" class=" | + | <ul id="gumax-nav" class="hover"> |
<li><a href="#">Home</a></li> | <li><a href="#">Home</a></li> | ||
- | <li>About Us | + | <li id=>About Us |
<ul> | <ul> | ||
<li><a href="#">History</a></li> | <li><a href="#">History</a></li> | ||
Line 73: | Line 95: | ||
</li> | </li> | ||
</ul> | </ul> | ||
- | |||
</body> | </body> | ||
</html> | </html> |
Revision as of 12:39, 17 April 2013