Форум программистов
 
Контакты: о проблемах с регистрацией, почтой и по другим вопросам пишите сюда - alarforum@yandex.ru, проверяйте папку спам! Обязательно пройдите активизацию e-mail.

Вернуться   Форум программистов > Web > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Здесь нужно купить рекламу за 20 тыс руб в месяц! ) пишите сюда - alarforum@yandex.ru
Без учёта ботов - 20000 человек в день, 350000 в месяц.

Ответ
 
Опции темы
Старый 15.10.2019, 18:04   #1
knightsbridge
Новичок
Джуниор
 
Регистрация: 15.10.2019
Сообщений: 1
По умолчанию Проблема с позиционированием третьего уровня выпадающего меню

Здравствуйте! На сайте установлено следующее CSS-меню. Раньше оно использовалось как двухуровневое: основной раздел и выпадающий список подразделов. Сейчас понадобилось чтобы в выпадающем списке отображался третий уровень. Необходимо сделать чтобы пункты меню третьего уровня позиционировались справа от родительского пункта второго уровня меню, но мне не удается этого сделать.
Код:
/* Top menu items */

#menu ul {

   margin:0;

   padding:0;

   list-style:none;

   float:right;

   position:relative;

   right:50%;

}

#menu ul li {

   margin:0 0 0 1px;

	padding: 0 2px 0 2px;

   float:left;

   position:relative;

   left:50%;

   top:5px;

}

#menu ul li a {

   display:block;

   margin:0;

   padding:.6em .5em .4em;

   font-size:1em;

   line-height:1em;

   text-decoration:none;

   color:#fff;

   font-weight:bold;

}

#menu ul li.active a {

   color:#fff;

   background:#000;

}

#menu ul li a:hover {

   background:#00d2f3; /* Top menu items background colour */

   color:#fff;

}

#menu ul li:hover a,

#menu ul li.hover a { /* This line is required for IE 6 and below */

   background:#00d2f3; /* Top menu items background colour */

   color:#fff;

}

/* Submenu items */

#menu ul ul {

   display:none; /* Sub menus are hiden by default */

   position:absolute;

   top:2em;

   left:0;

   right:auto; /*resets the right:50% on the parent ul */

   width:auto; /* width of the drop-down menus */

}

#menu ul ul li {

   left:auto;  /*resets the left:50% on the parent li */

   margin:0; /* Reset the 1px margin from the top menu */

   clear:left;

   width:100%;

}

#menu ul ul li a,

#menu ul li.active li a,

#menu ul li:hover ul li a,

#menu ul li.hover ul li a { /* This line is required for IE 6 and below */

	font-weight:bold; /* resets the bold set for the top level menu items */

	background-color:#005f8f;

	color:#fff;

	line-height:1.4em; /* overwrite line-height value from top menu */

	margin-bottom: 1px;

	text-align: left;

	white-space: nowrap;

}

#menu ul ul li a:hover,

#menu ul li.active ul li a:hover,

#menu ul li:hover ul li a:hover,

#menu ul li.hover ul li a:hover { /* This line is required for IE 6 and below */

	background-color:#00d2f3; /* Sub menu items background colour */

	color:#fff;

}

/* Flip the last submenu so it stays within the page */

#menu ul ul.last {

   left:auto; /* reset left:0; value */

   right:0; /* Set right value instead */

}

/* Make the sub menus appear on hover */

#menu ul li:hover ul,

#menu ul li.hover ul { /* This line is required for IE 6 and below */

   display:block; /* Show the sub menus */

}
Изображения
Тип файла: jpg menu.jpg (85.2 Кб, 56 просмотров)
knightsbridge вне форума   Ответить с цитированием
Ответ
Опции темы


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Кэш: определить размер кэша данных третьего уровня Uprres Assembler - Ассемблер 1 21.05.2016 06:18
Проблема с CSS позиционированием DIV-блоков RossDoker HTML и CSS 2 04.10.2012 23:23
Проблема с позиционированием меню сайта в IE Ru0208 HTML и CSS 7 14.04.2012 14:15
панель выпадающего меню violettta HTML и CSS 2 15.10.2011 17:21
Глюк выпадающего меню в IE Alexey_kor HTML и CSS 2 08.04.2011 15:54