"
Team:Calgary/Sandbox
From 2012.igem.org
(Difference between revisions)
| Line 67: | Line 67: | ||
#nav{ | #nav{ | ||
list-style: none; | list-style: none; | ||
| - | width: | + | width: 180px; |
margin: 0px 10px 0px 10px; | margin: 0px 10px 0px 10px; | ||
padding: 20px 0px 20px 10px; | padding: 20px 0px 20px 10px; | ||
| Line 94: | Line 94: | ||
color: white; | color: white; | ||
font-size: 1.5em; | font-size: 1.5em; | ||
| - | line-height: | + | line-height: 1.2em; /*line spacing between submenu rows*/ |
| - | text-indent: | + | text-indent: 0.8em; |
} | } | ||
#nav li a.dropheader{ | #nav li a.dropheader{ | ||
text-indent: 0; | text-indent: 0; | ||
| - | margin-top: 1. | + | margin-top: 1.3em; |
| - | + | ||
} | } | ||
/*primary menu styling*/ | /*primary menu styling*/ | ||
| Line 133: | Line 132: | ||
background: -moz-linear-gradient(left, #202020, #333); /* for firefox 3.6+ */ | background: -moz-linear-gradient(left, #202020, #333); /* for firefox 3.6+ */ | ||
} | } | ||
| + | /*1-column styles*/ | ||
#nav li div.col_1{ | #nav li div.col_1{ | ||
| - | left: - | + | left: -999px; |
| - | width: | + | width: auto; |
| + | padding-bottom: 1.5em; | ||
} | } | ||
| + | #nav li div.col_1 a{ | ||
| + | padding: 0 20px; | ||
| + | } | ||
| + | #nav li:hover div.col_1{ | ||
| + | left: 205px; | ||
| + | margin-top: -55px; | ||
| + | } | ||
| + | /*2-column styles*/ | ||
#nav li div.col_2{ | #nav li div.col_2{ | ||
| - | width: | + | width: auto; |
| + | left: -999em; | ||
| + | padding-bottom: 1.5em; | ||
height: auto; | height: auto; | ||
filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/ | filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,startColorstr='#333333', endColorstr='#424242'); /* for IE 6+7*/ | ||
| Line 147: | Line 158: | ||
} | } | ||
#nav li div.col_l, #nav li div.col_r{ | #nav li div.col_l, #nav li div.col_r{ | ||
| - | + | position: relative; | |
width: 180px; | width: 180px; | ||
| - | + | float: left; | |
| + | background: transparent; | ||
| + | margin-left: 20px; | ||
} | } | ||
| - | + | #nav li div.col_r{ | |
| - | + | margin-right: 20px; | |
| - | + | } | |
| - | + | #nav li:hover div.col_2{ | |
| - | + | left: 205px; | |
| - | + | margin-top: -55px; | |
| - | + | ||
| - | #nav li:hover div. | + | |
| - | left: | + | |
| - | top: - | + | |
} | } | ||
| Line 205: | Line 214: | ||
<li><a class="drop" href="#">Team</a> | <li><a class="drop" href="#">Team</a> | ||
<div class="col_1"> | <div class="col_1"> | ||
| + | <a class="dropheader" href="#">MEMBERS</a> | ||
<a href="#">Undergraduates</a> | <a href="#">Undergraduates</a> | ||
<a href="#">Advisors</a> | <a href="#">Advisors</a> | ||
<a href="#">Supervisors</a> | <a href="#">Supervisors</a> | ||
| + | <a class="dropheader" href="#">OFFICIAL PROFILE</a> | ||
| + | <a class="dropheader" href="#">THE UNIVERSITY</a> | ||
</div> | </div> | ||
</li> | </li> | ||
<li><a class="drop" href="#">Project</a> | <li><a class="drop" href="#">Project</a> | ||
| - | <div | + | <div class="col_2"> |
<div class="col_l"> | <div class="col_l"> | ||
<a class="dropheader" href="#">OVERVIEW</a> | <a class="dropheader" href="#">OVERVIEW</a> | ||
| Line 241: | Line 253: | ||
</li> | </li> | ||
<li><a href="#">Parts</a></li> | <li><a href="#">Parts</a></li> | ||
| - | <li><a class="drop" href="#">Notebook</a | + | <li><a class="drop" href="#">Notebook</a> |
| - | <div | + | <div class="col_1"> |
| + | <a class="dropheader" href="#">JOURNAL</a> | ||
| + | <a class="dropheader" href="#">SAFETY</a> | ||
| + | <a class="dropheader" href="#">PROTOCOLS</a> | ||
</div> | </div> | ||
| - | <li><a class="drop" href="#">Outreach</a | + | </li> |
| - | <div | + | <li><a class="drop" href="#">Outreach</a> |
| + | <div class="col_1"> | ||
| + | <a class="dropheader" href="#">HUMAN PRACTICES</a> | ||
| + | <a href="#">Video Series</a> | ||
| + | <a href="#">Video Game</a> | ||
| + | <a class="dropheader" href="#">FOLLOW US</a> | ||
| + | <a href="#">Twitter</a> | ||
| + | <a href="#">Facebook</a> | ||
</div> | </div> | ||
| + | </li> | ||
<li><a href="#">Sponsors</a></li> | <li><a href="#">Sponsors</a></li> | ||
<li><a href="#">iGEM Home</a></li> | <li><a href="#">iGEM Home</a></li> | ||
Revision as of 17:56, 25 June 2012
