Hi folks, I have to build a Bootstrapnavigation, in the beginning of all the submenus leftmost and in the 3rd menu level is followed to the right of Submenuebene. Here's a screenshot and the source code.

Has anyone ever such a menu built, or can anyone help me with this?

problem.jpg

CSS
HTML Code:
			div.navbar div.collapse.navbar-collapse {
				padding-left: 0px;
				padding-right: 0px;
			}
			.absolute { position: absolute; z-index: 8000;}
			.relative { position: relative; }
			.dropdown-menu {				
				border-radius: 0; 
				box-shadow: none;
				border: 1px solid #ccc;
			 	min-height: 350px;  
			  	width: 250px; 
			}			
			.dropdown-submenu {
			   position: static; 
			}			
			div.navbar-collapse > ul.navbar-nav > li {
				position: static;	
				width: 150px;
			}			
			.dropdown-submenu > .dropdown-menu {
			    top: 5px; /* RD f. Breakpoint wieder :0; */
			    left: 100%;
			    margin-top: -6px;
			    margin-left: -1px;

			}
			.dropdown-submenu > ul.dropdown-menu {
				width: 800px; 
			}			
			div.collapse.navbar-collapse ul.nav.navbar-nav li ul.dropdown-menu {
				list-style: square !important; 
			}			
			div.collapse.navbar-collapse ul.navbar-nav a {
				padding-left: 2px;
			}			
			div.collapse.navbar-collapse ul.navbar-nav li ul li a:before, 
			div.collapse.navbar-collapse ul.navbar-nav li ul li a:after {				
				display:none;
			}			
			div.navbar div.navbar-collapse ul.block-top li:hover ul.block-right {
				display: none;
			}			
			div.navbar div.navbar-collapse ul.block-top li:hover ul.block-left
			, div.navbar div.navbar-collapse ul.block-top li:hover ul.block-right {
				display: block;
				position: absolute;
				padding-left: 20px;
			} 
HTML::
HTML Code:
		    <div class="row mainnavigation">
		        <div class="col-lg-12">
		        	<!--------------------------------->		        	
					<div class="navbar navbar-default" role="navigation">
					    <div class="absolute">
					        <div class="navbar-header">
					            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
					                <span class="sr-only">Toggle navigation</span>
					                <span class="icon-bar"></span>
					                <span class="icon-bar"></span>
					                <span class="icon-bar"></span>
					            </button>            
					        </div>
					        <div class="collapse navbar-collapse">            
					            <ul class="nav navbar-nav block-top">                
					                
					                <li>
					                    <a href="#" class="dropdown-toggle">Menu 1 <b class="caret"></b></a>
					                    <ul class="dropdown-menu multi-level relative block-left">
					                        <li class="dropdown-submenu">
					                        	<a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 1 Submenu 1</a>
					                        	<ul class="dropdown-menu absolute block-right">
					                                <li class="dropdown-submenu"><a href="#">XXX Menu 1 Submenu 1 11111111111111</a></li>
					                                <li class="dropdown-submenu"><a href="#">XXX Menu 1 Submenu 1 11111111111111</a></li>
					                            </ul>
					                        </li>
					                        <li class="dropdown-submenu">
					                        	<a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 1 Submenu 2</a>
					                        	<ul class="dropdown-menu absolute block-right">
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 2 222222222222</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 2 2222222222222222</a></li>
					                            </ul>
					                        </li>
					                        <li class="dropdown-submenu">
					                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 1 Submenu 6</a>
					                            <ul class="dropdown-menu absolute block-right">
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>
					                                <li class="dropdown-submenu"><a href="#">Menu 1 Submenu 6 Item 2</a></li>					                                
					                            </ul>
					                        </li>
					                    </ul>
					                </li>
					                
					                <li>
					                    <a href="#" class="dropdown-toggle">Menu 2 <b class="caret"></b></a>
					                    <ul class="dropdown-menu multi-level relative block-left">
					                        <li class="dropdown-submenu">
					                        	<a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 2 Submenu 1</a>
					                        	<ul class="dropdown-menu absolute block-right">
					                                <li><a href="#">Menu 2 Submenu 1 2-2-2-2-2-2-2-2</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>
					                                <li><a href="#">Menu 2 Submenu 1 222-222-222-2222</a></li>					                               
					                                
					                            </ul>
					                        </li>
					                        <li class="dropdown-submenu">
					                        	<a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 2 Submenu 2</a>
					                        	<ul class="dropdown-menu absolute block-right">
					                                <li><a href="#">Menu 2 Submenu 2 Item 1</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 2</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 1</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 2</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 1</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 2</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 1</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 2</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 1</a></li>
					                                <li><a href="#">Menu 2 Submenu 2 Item 2</a></li>
					                            </ul>
					                        </li>
					                        <li class="dropdown-submenu">
					                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">Menu 2 Submenu 6</a>
					                            <ul class="dropdown-menu absolute block-right">
					                                <li><a href="#">Menu 2 Submenu 6 Item 2</a></li>
					                                <li><a href="#">Menu 2 Submenu 6 Item 2</a></li>
					                            </ul>
					                        </li>
					                    </ul>
					                </li>           
					                
					                
					            </ul>
					        </div><!--/.nav-collapse -->
					    </div>
					</div>
                                               			  
		        	<!--------------------------------->
		        </div>
		    </div>

Thx for your help ...