Team:Calgary/Sandbox
From 2010.igem.org
(Difference between revisions)
Line 3: | Line 3: | ||
<style> | <style> | ||
- | #nav | + | #nav { |
+ | width: 900px; | ||
+ | height: 250px ; | ||
+ | background: url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png); | ||
+ | margin: 10px auto; | ||
padding: 0; | padding: 0; | ||
+ | position: relative; | ||
+ | } | ||
+ | |||
+ | |||
+ | #nav li { | ||
margin: 0; | margin: 0; | ||
+ | padding: 0; | ||
list-style: none; | list-style: none; | ||
+ | position: absolute; | ||
+ | top: 0; | ||
} | } | ||
- | #nav li{ | + | #nav li, #nav a { |
- | + | height: 250px; | |
- | + | display: block; | |
- | + | ||
} | } | ||
- | # | + | #homepanel { |
- | + | ||
- | + | ||
- | + | ||
left: 0; | left: 0; | ||
+ | width: 180px; | ||
} | } | ||
- | # | + | #teampanel { |
- | + | left: 181px; | |
- | + | width: 180px; | |
} | } | ||
- | # | + | #projectpanel { |
- | + | left: 361px; | |
+ | width: 180px; | ||
} | } | ||
- | + | #extraspanel { | |
+ | left: 541px; | ||
+ | width: 180px; | ||
+ | } | ||
- | + | #sponsorspanel { | |
+ | left: 721px; | ||
+ | width: 180px; | ||
+ | } | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | + | #homepanel a:hover { | |
- | + | background: transparent url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png) 0 -250px no-repeat; | |
- | + | } | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | <li><a href="#"> | + | #teampanel a:hover { |
- | + | background: transparent url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png) -180px -250px no-repeat; | |
- | + | } | |
- | </li> | + | |
+ | |||
+ | #projectpanel a:hover { | ||
+ | background: transparent url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png) -360px -250px no-repeat; | ||
+ | } | ||
+ | |||
+ | |||
+ | #extraspanel a:hover { | ||
+ | background: transparent url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png) -540px -250px no-repeat; | ||
+ | } | ||
+ | |||
+ | |||
+ | #sponsorspanel a:hover { | ||
+ | background: transparent url(http://i242.photobucket.com/albums/ff10/somerndmguy/image1.png) -720px -250px no-repeat; | ||
+ | } | ||
+ | |||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | <body> | ||
+ | |||
+ | <ul id="nav"> | ||
+ | <li id="homepanel"><a href="#1"></a></li> | ||
+ | <li id="teampanel"><a href="#2"></a></li> | ||
+ | <li id="projectpanel"><a href="#3"></a></li> | ||
+ | <li id="extraspanel"><a href="#4"></a></li> | ||
+ | <li id="sponsorspanel"><a href="#5"></a></li> | ||
</ul> | </ul> | ||
Revision as of 20:37, 4 June 2010