Изменение горизонтального меню в вертикальное меню

Question

Я вот мой код для горизонтального меню. Теперь я хочу изменить это в вертикальное меню. Я не понимаю, как это сделать. Пожалуйста, помогите мне, как это сделать. Я попытался изменить ширину, но этого не произошло. Я не получаю, где можно редактировать теги <ul><li>, чтобы изменить их на вертикальные. Пожалуйста, предложите мне

#menu { 
    background: url('../image/menu.png') repeat-x; 
    position: relative; 
    z-index: 1; 
    height: 34px; 
    clear: both; 
    padding: 0px 30px; 
    min-width: 900px; 
} 
#menu > ul.left { 
    float: left; 
} 
#menu > ul.right { 
    float: right; 
} 
#menu > ul { 
    position: relative; 
    margin: 0; 
    padding: 0; 
} 
#menu > ul ul { 
    list-style: none; 
    margin: 0; 
    padding: 0; 
    background: url('../image/transparent.png'); 
} 
#menu > ul a { 
    display: block; 
    color: #FFFFFF; 
    text-decoration: none; 
    padding: 5px; 
} 
#menu > ul > li + li { 
    background: url('../image/split.png') center left no-repeat; 
} 
#menu > ul .top, #menu > ul li li.sfhover { 
    padding: 10px 15px 9px 17px; 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 12px; 
    color: #FFFFFF; 
    text-align: center; 
} 
#menu > ul ul li { 
    padding: 2px; 
} 
#menu > ul .selected .top { 
    background: url('../image/selected.png') repeat-x; 
    color: #FFFFFF; 
} 
#menu > ul .selected:hover a.top, #menu > ul .sfhover a.top { 
} 
#menu > ul .parent { 
    background: url('../image/arrow-right.png') 95% center no-repeat; 
} 
#menu > ul li { 
    float: left; 
    list-style: none; 
} 
#menu > ul li ul { 
    position: absolute; 
} 
#menu > ul li li { 
    clear: both; 
} 
#menu > ul li ul a { 
    color: #FFFFFF; 
    height: 15px; 
    width: 145px; 
} 
#menu > ul li ul ul { 
    margin: -27px 0 0 157px; 
} 
#menu > ul li li:hover, #menu > ul li li.sfhover { 
    background: #333; 
    color: #000000; 
} 

Answer 1

Я думаю, что

min-width: 900px;

в

#menu

вызывает вашу навигацию, чтобы остаться в горизонтальном прямоугольнике. Кажется, вы пытаетесь сделать ваш сайт отзывчивым? Возможно установить желаемый макс ширины и ваши ваши Li элементы имеют ширину 100%