Skip to content

Instantly share code, notes, and snippets.

@dwarjie
Created April 6, 2018 05:27
Show Gist options
  • Select an option

  • Save dwarjie/47744afac0ecd7cdf689c88e20bd3774 to your computer and use it in GitHub Desktop.

Select an option

Save dwarjie/47744afac0ecd7cdf689c88e20bd3774 to your computer and use it in GitHub Desktop.
Here is the code for the series that I'm doing (CSS Icons). You can use it on your code.
<!DOCTYPE html>
<html>
<head>
<title>Nav Bar Icon</title>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<div class="container">
<div class="sliding-bar-icon"></div>
</div>
</body>
</html>
* {
margin: 0px;
padding: 0px;
border: 0px;
}
.container {
width: 5%;
margin-right: auto;
}
.sliding-bar-icon {
margin-left: auto;
margin-top: 50px;
width: 40px;
height: 3px;
background-color: black;
cursor: pointer;
}
.sliding-bar-icon:before {
content: '';
position: absolute;
top: 40px;
width: 40px;
height: 3px;
background-color: black;
cursor: pointer;
}
.sliding-bar-icon:after {
content: '';
position: absolute;
top: 60px;
width: 40px;
height: 3px;
background-color: black;
cursor: pointer;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment