Автор Тема: Проблема с выпадающим меню у новичка  (Прочитано 2005 раз)

11 Сентябрь, 2016, 19:29:03

Оффлайн Dalia

  • Школьник
  • *
  • Сообщений: 3
  • Репутация: 0
  • OS: Windows NT 10.0 Windows NT 10.0
  • Browser: Chrome 52.0.2743.116 Chrome 52.0.2743.116
    • Просмотр профиля
Здравствуйте ) Я совсем-совсем новичок, и создала себе проблему, которую никак не могу решить.
Собственно, вся проблема на скриншоте: видео и фото должны выпадать из галереи, а не из пустого места (я так понимаю, элемент галерея как раз там и находится, а текст куда-то отнесло), расстояние между пунктами должно быть одинаковым.
Когда подменю прячется, ничего не меняется, расстояние такое же дурацкое.
 Не могу понять, как так вообще получилось, и как это исправить... :facepalm:
Буду благодарна за любую подсказку, весь код css прикрепляю.

* {
    width: 960px;
    background-image: url(bg.png);
    background-repeat: repeat;
    background-attachment: fixed;
}

.navigation {
    width: 960px;
    height: 260px;
}

.navigation ul {
    height: 45px;
    position: absolute;
}
.navigation li {
    width: 130px;
    height: 45px;
    float: left;
    list-style-type: none;
    color: #ffffff;
    text-shadow: #5A2973 2px 2px 2px, #5A2973 -2px -2px 2px, #5A2973 -2px 2px 2px, #5A2973 2px -2px 2px;
    line-height: 40px;
}
.navigation a {
    display: block;
    font-family: 'Fontdiner Swanky', cursive;
    color: #000;
    text-decoration: none;
}


.dropdown {
    position: absolute;
    margin-top: 4px;
    width: 130px;
    height: 135px;
    display: none;
    float: left;
    top: 100%;
}

.navigation li:hover > ul {
    display: block;
}

Форум вебмастеров - Webmasters.BY

Проблема с выпадающим меню у новичка
« : 11 Сентябрь, 2016, 19:29:03 »

11 Сентябрь, 2016, 19:52:49
Ответ #1

Оффлайн Diver

  • Administrator
  • Гуру форума
  • *****
  • Сообщений: 4928
  • Репутация: 112
  • Шииикарно!
  • OS: Windows NT 10.0 Windows NT 10.0
  • Browser: Firefox 48.0 Firefox 48.0
    • Просмотр профиля
по картинке гадать дело не благодарное, да и пользы от css-кода, без html, тоже не много,
лучше разместите код меню на http://plnkr.co/edit/?p=catalogue и скиньте сюда ссылку

11 Сентябрь, 2016, 19:55:59
Ответ #2

Оффлайн Dalia

  • Школьник
  • *
  • Сообщений: 3
  • Репутация: 0
  • OS: Windows NT 10.0 Windows NT 10.0
  • Browser: Chrome 52.0.2743.116 Chrome 52.0.2743.116
    • Просмотр профиля

11 Сентябрь, 2016, 19:59:39
Ответ #3

Оффлайн Diver

  • Administrator
  • Гуру форума
  • *****
  • Сообщений: 4928
  • Репутация: 112
  • Шииикарно!
  • OS: Windows NT 10.0 Windows NT 10.0
  • Browser: Firefox 48.0 Firefox 48.0
    • Просмотр профиля
просто разместите выпадающее меню внутри тега li с галереей

<li class="gallery"><a href="#">Gallery</a>
            <ul class="dropdown">
                    <li> <a href="#">Photo</a></li>
                    <li> <a href="#">Video</a></li>
                </ul>
            </li>

11 Сентябрь, 2016, 20:01:51
Ответ #4

Оффлайн Dalia

  • Школьник
  • *
  • Сообщений: 3
  • Репутация: 0
  • OS: Windows NT 10.0 Windows NT 10.0
  • Browser: Chrome 52.0.2743.116 Chrome 52.0.2743.116
    • Просмотр профиля
Гениально! Огромное спасибо ! :ok:

14 Август, 2017, 13:04:38
Ответ #5

Оффлайн georgios

  • Школьник
  • *
  • Сообщений: 20
  • Репутация: 1
  • OS: Windows NT 6.2 Windows NT 6.2
  • Browser: Firefox 54.0 Firefox 54.0
    • Просмотр профиля
С такой же проблемой столкнулся, благодарю помогатора )