Форум программистов, компьютерный форум, киберфорум
Наши страницы
HTML, CSS
Войти
Регистрация
Восстановить пароль
 
Aer_rus
0 / 0 / 2
Регистрация: 13.10.2013
Сообщений: 91
1

Как сделать так, чтобы выпадающие пункты меню были не вертикальными, а горизонтальными?

20.11.2016, 14:23. Просмотров 328. Ответов 1
Метки нет (Все метки)

Дано вертикальное меню. Подскажите пожалуйста как сделать так, чтобы выпадающие пункты меню были не вертикальными, а горизонтальными.
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
ul{
  margin: 0;
  padding: 0;
}
ul.nav li {
  background: #B3B3FF;
  border: 1px solid #FFFFFF;
  list-style: none;
  width: 150px;         /*ширина блока меню*/
}
ul.nav li a {
  text-decoration: none;
  display: block;
  padding: 5px 5px 5px 15px;
}
ul.nav li ul {
  display: none;    /*скрываем вложенные пункты*/
}
 
/*Выпадающее меню*/
 
ul.nav li:hover {
  position: relative;
  background: yellow;
}
ul.nav li:hover > ul {
  display: block;
}
ul.nav li:hover ul{
  position: absolute;
  top: 0;       /*Задаём координаты для вложенных пунктов*/
  left: 150px; /*меню раскрывается вправо*/
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
20.11.2016, 14:23
Ответы с готовыми решениями:

Как сделать выпадающие пункты меню на одном уровне с родительским пунктом?
Всем доброго дня. Есть вертикальное выпадающее меню. Никак не соображу как...

Горизонтально выпадающее меню ! как увеличить выпадающие пункты ?
При наведении выпадет меню , но надписи в пунктах не влезают в ячейку , как...

Выпадающие пункты начинаются сверху, css - как сделать?
Делаю выпадающее меню на css, вертикальное. Все работает, но я хочу, чтобы...

Выпадающие пункты меню не раздвигаются по длине текста
Добрый день! С Вашей помощью кое как сделала меню на сайте...

Как сделать так, чтобы на одной строке были 2 div, один был с левой стороны экрана, второй с правой?
Мне нужно, чтобы заголовок окна был прикреплён к левой части экрана, кнопка к...

1
Fedor92
Человек из 90-х
Эксперт HTML/CSS
2745 / 2304 / 1017
Регистрация: 15.12.2012
Сообщений: 8,555
Записей в блоге: 1
20.11.2016, 14:27 2
Aer_rus, примерно так:
CSS
1
ul.nav>li{display-inline:block}
0
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
20.11.2016, 14:27

Как сделать так, чтобы картинки на сайте (обложка журнала и скрин youtube) были автоматически на всю ширину экрана и мен
Как сделать так, чтобы картинки на сайте (обложка журнала и скрин youtube) были...

Как залить фон меню цветом и сделать так, чтобы изображения отображались (вн)
Первое изображение - как должно быть, второе - что у меня. Фрагменты css, в...

как сделать выпадающие горизонтальное меню на css?
нужно меню из 3-х пунктов с 3 выплывающими из каждого пункта!


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru