Вопросы Теги

Выпадающее меню, которое открывается вверх/вверх с помощью чистого css

Я создал выпадающее меню с помощью чистого CSS и добился того, что оно мне нравится, за исключением того, что я хочу, чтобы оно было "выпадающим", а не "выпадающим", поскольку строка меню находится внизу макета. Что мне нужно добавить или изменить, чтобы сделать его "выпадающим"?

#menu * { padding:0; margin: 0; font: 12px georgia; list-style-type:none; } #menu { margin-top: 100px; float: left; line-height: 10px; left: 200px; } #menu a { display: block; text-decoration: none; color: #3B5330; } #menu a:hover { background: #B0BD97;} #menu ul li ul li a:hover { background: #ECF1E7; padding-left:9px; border-left: solid 1px #000; } #menu ul li ul li { width: 140px; border: none; color: #B0BD97; padding-top: 3px; padding-bottom:3px; padding-left: 3px; padding-right: 3px; background: #B0BD97; } #menu ul li ul li a { font: 11px arial; font-weight:normal; font-variant: small-caps; padding-top:3px; padding-bottom:3px; } #menu ul li { float: left; width: 146px; font-weight: bold; border-top: solid 1px #283923; border-bottom: solid 1px #283923; background: #979E71; } #menu ul li a { font-weight: bold; padding: 15px 10px; } #menu li { position:relative; float:left; } #menu ul li ul, #menu:hover ul li ul, #menu:hover ul li:hover ul li ul { display:none; list-style-type:none; width: 140px; } #menu:hover ul, #menu:hover ul li:hover ul, #menu:hover ul li:hover ul li:hover ul { display:block; } #menu:hover ul li:hover ul li:hover ul { position: absolute; margin-left: 145px; margin-top: -22px; font: 10px; } #menu:hover ul li:hover ul { position: absolute; margin-top: 1px; font: 10px; }

39
задан Mohammad Usman 16 November 2016 в 13:01
поделиться