выпадающего меню с помощью CSS

Question

Я найти сценарий, который может сделать свое меню как

Я нахожу некоторый сценарий, но подменит выравнивается влево, не нравится.

<div id="menu-container"> 
       <ul class="menu" style="background-color:#1DBAA5;"> 
       <li style="padding-left:10px;padding-top:10px" class="level1 nav-2-<?php echo $demmn; ?> first dropdown" > 
         <a href="#" style="color:#fff"> 
          <span>TEST</span> 
         </a> 
         <ul class="dropdown-menu" id="menu1" style="background:#111;width:600px"> 
         <li> 
          <a href="#" style="color:#fff">TEST</a> 
         </li> 
         <li><a href="#" style="color:#fff">TEST</a></li> 
         <li><a href="#" style="color:#fff">TEST</a></li> 
         <li><a href="#" style="color:#fff">TEST</a></li> 
         </ul> 
        </li> 
       </ul> 
      </div> 

Мой CSS

.dropdown-menu .sub-menu { 
left: 100%; 
position: absolute; 
} 

.menu{ 
    max-width: 600px; 
    } 

    .menu>li{ 
    } 

.dropdown-menu li { 
width: 30%; 
display: inline-block; 

} 

Answer 1

Попробуйте .Это будет выравнивать с в левой

я изменить значение <ul class="dropdown-menu" id="menu1" style="background:#111;width:475px"> для такого же изменения sizing.you по вашему желанию.

Они будут использовать для выравнивания левого положения

.dropdown-menu .sub-menu { 
left: 100%; 
position: absolute; 
} 

.menu{ 
max-width: 600px; 
padding-top:10px; 
} 

.menu>li{ 
display: inline; 
padding-left: :20px; 
} 

.dropdown-menu li { 
    width: 30%; 
    display: inline-block; 

    } 

<div id="menu-container"> 
       <ul class="menu" style="background-color:#1DBAA5;"> 
       <li style="padding-left:10px;padding-top:10px" class="level1 nav-2-<?php echo $demmn; ?> first dropdown" > 
         <a href="#" style="color:#fff"> 
          <span>TEST</span> 
         </a> 
         <ul class="dropdown-menu" id="menu1" style="background:#111;width:475px"> 
         <li> <a href="#" style="color:#fff">TEST</a></li> 

         <li><a href="#" style="color:#fff">TEST</a></li> 
         <li><a href="#" style="color:#fff">TEST</a></li> 
         <li><a href="#" style="color:#fff">TEST</a></li> 
         </ul> 
        </li> 
       </ul> 
      </div> 

Answer 2

Эта часть .dropdown-menu .sub-menu не была включена в код