Line 5: | Line 5: | ||
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> | <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"> | ||
<style> | <style> | ||
− | . | + | .dropdown { |
− | . | + | position: relative; |
− | + | display: inline-block; | |
− | + | } | |
− | + | ||
− | + | .dropdown-content { | |
− | + | text-align:center; | |
− | . | + | display: none; |
+ | position: absolute; | ||
+ | background-color: #333333; | ||
+ | box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | ||
+ | padding: 12px 24px 12px 8px; | ||
+ | } | ||
+ | |||
+ | .dropdown:hover .dropdown-content { | ||
+ | display: block; | ||
+ | } | ||
@media only screen and (max-width: 1024px) { | @media only screen and (max-width: 1024px) { | ||
Line 31: | Line 40: | ||
<ul> | <ul> | ||
<li><a style="color: white;" href="https://2016.igem.org/Team:Duesseldorf">Home</a></li> | <li><a style="color: white;" href="https://2016.igem.org/Team:Duesseldorf">Home</a></li> | ||
− | <li><a href="https://2016.igem.org/Team:Duesseldorf/Description">Description</a></li> | + | <li class="dropdown"><a href="#">Project</a> |
+ | <div class="dropdown-content"> | ||
+ | <ul> | ||
+ | <li><a href="https://2016.igem.org/Team:Duesseldorf/Description">Description</a></li> | ||
<li><a href="https://2016.igem.org/Team:Duesseldorf/Demonstrate">Demonstrate</a></li> | <li><a href="https://2016.igem.org/Team:Duesseldorf/Demonstrate">Demonstrate</a></li> | ||
<li><a href="https://2016.igem.org/Team:Duesseldorf/Proof">Proof</a></li> | <li><a href="https://2016.igem.org/Team:Duesseldorf/Proof">Proof</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
+ | </li> | ||
<li><a href="https://2016.igem.org/Team:Duesseldorf/Collaborations">Collaborations</a></li> | <li><a href="https://2016.igem.org/Team:Duesseldorf/Collaborations">Collaborations</a></li> | ||
<li><a href="https://2016.igem.org/Team:Duesseldorf/Outreach">Outreach</a></li> | <li><a href="https://2016.igem.org/Team:Duesseldorf/Outreach">Outreach</a></li> |
Revision as of 14:03, 18 October 2016