Horizontally ceentered nav menu

Tutorials of (Horizontally ceentered nav menu) by Ernest

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Horizontally ceentered nav menu</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <ul>
	<li id="nav-home"><a href="#">Home</a></li>
  <li id="nav-blog"><a href="#">Blog</a></li>
	<li id="nav-links"><a href="#">Links</a></li>
	<li id="nav-about"><a href="#">About</a></li>
</ul>
  
  
</body>
</html>
/* Downloaded from https://www.codeseek.co/ */
ul { /* also works with ol */
    width: 100%; /* or your desired width */
    text-align: center; /* this will center the list items */
}
li {
    display: inline-block; /* the key bit */
    *display: inline; /* IE7 hack */
    *zoom: 1; /* IE7 hack */
}

ul li a {
   margin:20px; 
   padding: 20px;
  text-decoration: none;
}
 
/* Downloaded from https://www.codeseek.co/ */

This awesome code ( Horizontally ceentered nav menu ) is write by Ernest, you can se more from this user in the personal repository

You can find the original code on Codepen.io

2018 © Ernest

More from Ernest

You Might Also Like