0 Пользователей и 1 Гость просматривают эту тему.
  • 3 Ответов
  • 1294 Просмотров
*

Xzizz

  • Захожу иногда
  • 172
  • 1 / 0
Горизонтальное меню с выпадающим списком, съезжает последняя кнопка.
Когда страница загружается все отлично, а секунд через 2 , последняя кнопка заезжает под остальные, как побороть ?
Сайт на денвере, поэтому показать не могу.

HTML
Код
<ul class="dropdown">
<li class="dropdown-top"><a class="dropdown-top" href="#">1</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">1-1</a></li>
<li><a href="#" title="!">1-2</a></li>
<li><a href="#" title="!">1-3</a></li>
<li><a href="#" title="!">1-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">2</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">2-1</a></li>
<li><a href="#" title="!">2-2</a></li>
<li><a href="#" title="!">2-3</a></li>
<li><a href="#" title="!">2-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">3</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">3-1</a></li>
<li><a href="#" title="!">3-2</a></li>
<li><a href="#" title="!">3-3</a></li>
<li><a href="#" title="!">3-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">4</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">4-1</a></li>
<li><a href="#" title="!">4-2</a></li>
<li><a href="#" title="!">4-3</a></li>
<li><a href="#" title="!">4-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">5</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">5-1</a></li>
<li><a href="#" title="!">5-2</a></li>
<li><a href="#" title="!">5-3</a></li>
<li><a href="#" title="!">5-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">6</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">6-1</a></li>
<li><a href="#" title="!">6-2</a></li>
<li><a href="#" title="!">6-3</a></li>
<li><a href="#" title="!">6-4</a></li>
</ul>
</li>
<li class="dropdown-top"><a class="dropdown-top" href="#">7</a>
<ul class="dropdown-inside">
<li><a href="#" title="!">7-1</a></li>
<li><a href="#" title="!">7-2</a></li>
<li><a href="#" title="!">7-3</a></li>
<li><a href="#" title="!">7-4</a></li>
</ul>
</li>
</ul>

CSS
Код
ul.dropdown li { position: relative; z-index:1; }
ul.dropdown a {color: #fff }
 ul.dropdown,
 ul.dropdown-inside {
 list-style-type: none;
 padding: 0;
 
 }
 ul.dropdown-inside {
 position: absolute;
 left: -9999px;
 }
 ul.dropdown li.dropdown-top {
 display: inline;
 float: left;
 margin: 0 1px 0 0;
 }
 ul.dropdown li.dropdown-top a {
 padding: 3px 20px 4px;
 display: block;
 text-decoration:none;
 }
 ul.dropdown a.dropdown-top { background: #CCCCCC; border-radius:5px }
 ul.dropdown a.dropdown-top:hover { padding: 3px 20px 4px; }
 ul.dropdown li.dropdown-top:hover .dropdown-inside {
 display: block;
 left: 0;
 }
 ul.dropdown .dropdown-inside {background: #CCCCCC; border-radius:5px }
 ul.dropdown .dropdown-inside a:hover { background: #1FA2D6;border-radius:5px }
« Последнее редактирование: 25.12.2015, 12:43:05 от Xzizz »
*

caleblt

  • Захожу иногда
  • 51
  • 3 / 0
Нужно показать код сайта как раз после этих двух секунд. Видимо контейнер по ширине меньше чем список.
*

Grigory S.

  • Давно я тут
  • 658
  • 70 / 0
  • (с)
И свойство display можно не указывать, если используется float.
Не задав правильный вопрос, невозможно получить правильный ответ.
Для "спасибок" существует кнопочка "+".
*

Xzizz

  • Захожу иногда
  • 172
  • 1 / 0
Спасибо всем кто оставил комментарии, оказалось что достаточно было растянуть таблицу на 100% в которой находился список.
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Кликабельность псевдоэлемента в пункте меню

Автор vasilii.pupkov

Ответов: 4
Просмотров: 1607
Последний ответ 29.12.2021, 23:15:38
от v42bis
Выпадающее меню

Автор DrShepard

Ответов: 10
Просмотров: 2178
Последний ответ 20.10.2021, 12:36:16
от DrShepard
Как закруглить края выпадающего меню?

Автор coliandra

Ответов: 1
Просмотров: 831
Последний ответ 11.12.2020, 21:15:57
от effrit
При прокрутке страницы виджет залезает на меню

Автор coliandra

Ответов: 2
Просмотров: 806
Последний ответ 27.11.2020, 11:33:58
от coliandra
[Решено] Как сделать чтобы фотография открылась в отдельном окне?

Автор a-two

Ответов: 11
Просмотров: 1294
Последний ответ 03.11.2020, 16:57:40
от Nikolay89