DropDown-Menü wird nicht über #container angezeigt

**ed881** · 12.07.2015, 20:00

Hallo, ich habe ein Problem: und zwar bekome ich es nicht hin, dass mein DropDown-Menü über dem #container div angezeigt wird.

Hier mal ein Link zur Seite:
-

Die grünen Punkte sind die level_2 und level_3 Punkte die eigentlich über dem Inhalt angezeigt werden sollten.

Das Menü habe ich nach folgender Anleitung aufgebaut:
http://www.ourtuts.com/create-a-drop...tml5-and-css3/

Das ein- und ausblenden habe ich mal deaktiviert, das funktioniert soweit richtig. Ich hoffe mir kann jemand helfen. Hier relevante Code:

HTML-Code:

/* Dropdown Menu
		---------------------------------------------------------------------*/
		
		nav {
			position: relative;
			width: 100%;
			margin: 0 auto;
			display: block;
		}
		
		nav ul.level_1 {
			margin: 0 auto;
			position: relative;
			float: left;
			width: 100%;
		}
		
		nav ul.level_1 li {
			display: inline;
			position: relative;
			float: left;
			width: 16.6666667%;
		}
		
		nav ul.level_1 li a,
		nav ul.level_1 li span {
			display: inline-block;
			width: 100%;
			border: none;
			font-size: 1rem;
			position: relative;
			
			-webkit-transition:color 0.2s linear, background 0.2s linear;   
			-moz-transition:color 0.2s linear, background 0.2s linear;  
			-o-transition:color 0.2s linear, background 0.2s linear;    
			transition:color 0.2s linear, background 0.2s linear;
		}
		
		/* Drop-Down Navigation */
		nav ul.level_1 li:hover > ul {
			visibility: visible;
			opacity: 1;
		}
		
		nav ul.level_2,
		nav ul.level_3 {
			/*visibility: hidden;
			opacity: 0;*/
			position: absolute;
			z-index: 99999;
			background: yellow;
			width: 100%;
			
			-webkit-transition:color 0.2s linear, background 0.2s linear;   
			-moz-transition:color 0.2s linear, background 0.2s linear;  
			-o-transition:color 0.2s linear, background 0.2s linear;    
			transition:color 0.2s linear, background 0.2s linear;
		}
		
		nav ul.level_2 {
			top: 10px;
		}
		
		nav ul.level_3 {
			top: 0;
			left: 100%; /* von oben */
		}
		
		nav ul.level_2 li {
			clear: both;
			width: 100%;
		}
		
		nav ul.level_2 a {
			background: green;
			display: inline-block;
			float: left;
			clear: both;
			width: 100%;
		}