Last active
September 28, 2016 16:33
-
-
Save mikebobadilla/7595b451dc0d9a5e6dc12882c498e1a8 to your computer and use it in GitHub Desktop.
Untitled
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
.dropbtn { | |
background-color: #4CAF50; | |
color: white; | |
padding: 16px; | |
font-size: 16px; | |
border: none; | |
cursor: pointer; | |
}/* The container <div> - needed to position the dropdown content */ | |
.dropdown { | |
position: relative; | |
display: inline-block; | |
}/* Dropdown Content (Hidden by Default) */ | |
.dropdown-content { | |
display: none; | |
position: absolute; | |
background-color: #f9f9f9; | |
min-width: 160px; | |
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); | |
}/* Links inside the dropdown */ | |
.dropdown-content a { | |
color: black; | |
padding: 12px 16px; | |
text-decoration: none; | |
display: block; | |
}/* Change color of dropdown links on hover */ | |
.dropdown-content a:hover { | |
background-color: #red; | |
}/* Show the dropdown menu on hover */ | |
.dropdown:hover .dropdown-content { | |
display: block; | |
margin-bottom: 100px; | |
}/* Change the background color of the dropdown button when the dropdown content is shown */ | |
.dropdown:hover .dropbtn { | |
background-color: #3e8e41; | |
} |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="dropdown"> | |
<button class="dropbtn">Dropdown</button> | |
<div class="dropdown-content"> | |
<a href="#">Link 1</a> | |
<a href="#">Link 2</a> | |
<a href="#">Link 3</a> | |
</div> | |
</div> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// alert('Hello world!'); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment