Dropdown Menu 03

Here I test some Dropdown Menus I found on the net.

<!DOCTYPE html>
<html >
<head>
  <meta charset="UTF-8">
  <title>Dropdown Menu 03</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>
  <a href="http://www.antsmagazine.com/web-development/25-free-examples-of-css-drop-down-list-and-menus/">25 Beispiele</a>
<ul class="dropmenu">
  <li><a href="#">Home</a></li>
  <li class="dir"><a href="#">About</a><ul>
    <li><a href="#">Item</a></li>
    <li class="dir"><a href="#">Subs Here</a><ul>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
      <li><a href="#">Item</a></li>
    </ul></li>
    <li><a href="#">Item</a></li>
    <li><a href="#">Item</a></li>
  </ul></li>
  <li><a href="#">Portfolio</a></li>
  <li><a href="#">Contact</a></li>
</ul>
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
  
  
</body>
</html>
/* Downloaded from https://www.codeseek.co/ */
/* basic menu code 1.0 */
.dropmenu ul {
  margin: 0;
  padding: 0;
}

.dropmenu li {
  float: left;
  list-style: none;
	background: #bbb;
	position: relative;
}

.dropmenu li a {
	text-decoration: none;
	color: #fff;
	display: block;
	padding: 0.5em 1em;
}

.dropmenu li ul {
	display: none;
	position: absolute;
	left: 0; top: 100%;
	width: 10em;
	box-shadow: 0 0 2px rgba(0,0,0,0.2);
	z-index: 999;
}

.dropmenu li ul li {
	float: none;
}

.dropmenu li ul li ul {
	left: 100%; top: 0;
}

.dropmenu li:hover {
	background: #aaa;
}

.dropmenu li:hover > ul {
	display: block;
}

.dropmenu li.dir > a:after {
	content: " +";
	color: #fff;
}

.dropmenu:after {
	content: "";
	display: table;
	clear: both;
}
/* Downloaded from https://www.codeseek.co/ */

This awesome code ( Dropdown Menu 03 ) is write by Markus Ziegler, you can se more from this user in the personal repository

You can find the original code on Codepen.io

2018 © Markus Ziegler