A Pen by Igor

Thumbnail
This awesome code was written by ig90, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright ig90 ©
  • HTML
  • CSS
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  Igor</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

   <header>
<div id="bg">  
  <div class="content">
<nav id="menu">

  <img class="logo" src="" alt="logo">
  <ul class="menuList">
    <li><a href="#" title="pricing">Pricing</a></li>
    <li><a href="#" title="docs">Docs</a></li>
    <li><a href="#" title="about">About</a></li>
    <li><a href="#" title="contact">Contact us</a></li>
  </ul>
</nav>
  </div>
  </div>
</header>


<section class="main">
  <br>
  <br>
   <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br>

</section>
  
  

</body>

</html>

/*Downloaded from https://www.codeseek.co/ig90/a-pen-by-igor-gemwKL */
@import url('https://fonts.googleapis.com/css?family=Ubuntu');


#bg{
  padding: 400px 0;
  transform:skew(0deg, 5deg);
  margin-top: -400px; 
  background: linear-gradient(125deg, #2e004f 30%, #371a95 70%);
}
.content{
  transform:skew(0deg, -5deg);
  text-align: center;
}
.menuList{
  list-style: none;
  margin-left:50%;
  font-size: 1.5rem;
}
.menuList li{
    display:inline-block;
    background-color: 
    clear:both;
    font-family: 'Ubuntu', sans-serif;
    margin-left: 5%;
}
.menuList li a{
  text-decoration: none;
  color: white;
}
#menu{
  width:100%;
  height: 40px;
  line-height: 40px;
}
.logo{
  display:inline-block;
  float: left;
  width:5%;
  margin-left:2%;
}
body{
  margin:0;
  padding:0;
}
header{

}


Comments