Выпадающее меню

@Nastusik · Регистрация: 04.11.2009

Студворк — интернет-сервис помощи студентам

Добрый день, подскажите пожалуйста почему при верстке выпадающего меню в ие7 возникают след. проблемы(на рис). Нужны отступы для выпадающих пунктов на 10 px влево, с помощью padding-right не получается, он увеличивает весь пункт на 10 px вправо. Так же проблема с z-index, ие его никак не воспринимает, на рис. видно как нижний модуль в котором выводятся новости перекрывает меню.

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<ul class="menu">                                           
 
        <li class="sdf"><strong><a href="http://localhost/joomla"><span class="gray_text">01</span><p>ГЛАВНАЯ</p></a></strong></li>
        <li class="sdl"><strong><a href="index.php?option=com_content&view=article&id=47"><span class="gray_text">02</span><p>О КОМПАНИИ</p></a></strong>
            <ul>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=56">ЛАБОРАТОРИЯ</a></li>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=57">КЛИЕНТЫ</a></li>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=58">ВАКАНСИИ</a></li>
            </ul>
        </li>
        <li class="sdl"><strong><a href="index.php?option=com_content&view=article&id=48"><span class="gray_text">03</span><p>УСЛУГИ</p></a></strong></li>
        <li class="sdl"><strong><a href="index.php?option=com_content&view=article&id=49"><span class="gray_text">04</span><p>ПРОДУКЦИЯ</p></a></strong>
            <ul>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=52">БЕТОН</a></li>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=53">ПЕСКОБЛОКИ</a></li>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=54">ЖБИ ИЗДЕЛИЯ</a></li><li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=55">ИНЕРТНЫЕ МАТЕРИАЛЫ</a></li>
                <li><a style="padding:0px 0px 5px;" href="index.php?option=com_content&view=article&id=62">ПРАЙС-ЛИСТЫ</a></li>
            </ul>
        </li>
                    
        <li class="sdl"><strong><a href="index.php?option=com_content&view=article&id=50"><span class="gray_text">05</span><p>ЗАКАЗ</p></a></strong></li>
        <li class="sdl"><strong><a href="index.php?option=com_content&view=article&id=51"><span class="gray_text">06</span><p>КОНТАКТЫ</p></a></strong></li>
    </ul>

HTML5
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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
ul.menu {
    margin-top: 0px;
    margin-bottom:-2px;
    list-style-type:none;
    width:auto;
    position:relative;
    height:65px;
    font-size:11px;
    margin-left:25px;
    padding:0;
}
 
ul.menu li {
    float:left;
    margin: 0px;
    padding:0px;
    text-align:right;
    display:inline;
    position: relative;
    list-style-type:none
}
 
 
ul.menu li a {
    float:left;
    color:#000000;
    text-decoration:none;
    display: block;
    overflow: hidden;
    background:#ffffff;
    display:inline
}
 
ul.menu p {margin-top: 11px; margin-bottom:6px; margin-right:10px}
 
li.sdf, li.sdf a, li.sdf a:hover,.current {width:233px; padding:15px 0px 0px 0px; }
 
li.sdl, li.sdl a, li.sdl a:hover,.current {width:139px; padding:15px 0px 0px; }
 
ul.menu li a:hover {background-color:#ffb400;}
 
ul.menu li ul {
    display:none;
    position:absolute;
    top:67px;
    background:#858585; 
    margin:0px;
    opacity:0.85;
    line-height:normal;
    left: 0px;
    z-index:1000
}
ul.menu li ul:hover{display:block}
 
ul.menu li ul li{float: none; margin:0px;}
 
 
ul.menu li:hover ul, li.over ul,ul.menu li:jshover ul {display:block;}
 
ul.menu li:hover ul li a,ul.menu li:jshover ul li a{
    display:block;
    color: #fff;
    background: #858585;
    display:inline
}
 
ul.menu ul li:hover a:hover, ul.menu ul li:jshover a:hover{color:#ffb400;}
 
ul.menu li:hover a, ul.menu li:jshover a{background:#ffb400;}

@Nastusik · 04.11.2009, 09:59 **[ТС]**

Проблема с z-index'ом решена, нужно было просто добавить z-index:100 кроме ul.menu li ul и к ul.menu {z-index:100}. http://www.webcocktail.ru/codi... -explorer/

@Nastusik · 05.11.2009, 06:05 **[ТС]**

Неужели это невыполнимо?

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Обработчик клика мыши в браузере ПК и касания экрана в браузере на мобильном устройстве 8Observer8 02.02.2026 Содержание блога Для начала пошагово создадим рабочий пример для подготовки к экспериментам в браузере ПК и в браузере мобильного устройства. Потом напишем обработчик клика мыши и обработчик. . .	Философия технологии iceja 01.02.2026 На мой взгляд у человека в технических проектах остается роль генерального директора. Все остальное нейронки делают уже лучше человека. Они не могут нести предпринимательские риски, не могут. . .	SDL3 для Web (WebAssembly): Вывод текста со шрифтом TTF с помощью SDL3_ttf 8Observer8 01.02.2026 Содержание блога В этой пошаговой инструкции создадим с нуля веб-приложение, которое выводит текст в окне браузера. Запустим на Android на локальном сервере. Загрузим Release на бесплатный. . .	SDL3 для Web (WebAssembly): Сборка C/C++ проекта из консоли 8Observer8 30.01.2026 Содержание блога Если вы откроете примеры для начинающих на официальном репозитории SDL3 в папке: examples, то вы увидите, что все примеры используют следующие четыре обязательные функции, а. . .
SDL3 для Web (WebAssembly): Установка Emscripten SDK (emsdk) и CMake для сборки C и C++ приложений в Wasm 8Observer8 30.01.2026 Содержание блога Для того чтобы скачать Emscripten SDK (emsdk) необходимо сначало скачать и уставить Git: Install for Windows. Следуйте стандартной процедуре установки Git через установщик. . . .	SDL3 для Android: Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	SDL3 для Android: Загрузка PNG с альфа-каналом с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .

@Nastusik 1 / 1 / 0 Регистрация: 04.11.2009 Сообщений: 17
	04.11.2009, 09:59 [ТС]
	Проблема с z-index'ом решена, нужно было просто добавить z-index:100 кроме ul.menu li ul и к ul.menu {z-index:100}. http://www.webcocktail.ru/codi... -explorer/ 0

@Nastusik 1 / 1 / 0 Регистрация: 04.11.2009 Сообщений: 17
	05.11.2009, 06:05 [ТС]
	Неужели это невыполнимо? 0