• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Menu rozwijane CSS

VPS Starter Arubacloud
0 głosów
163 wizyt
pytanie zadane 12 stycznia 2019 w HTML i CSS przez adikpl Użytkownik (660 p.)
zmienione kategorie 12 stycznia 2019 przez adikpl

Witam, nie wiem dlaczego lista rozwijana nie działa (lista się nie rozwija). 

Proszę o pomoc!

 

#left_nav > ul > li {
	list-style-type:none;
	padding:0;
	margin:0;
	text-align:center;
}


#left_nav > ul > li{
	float:left;
	margin-left:-40px;
	width:220px;
	display:none;
	
}

#left_nav > ul > li:first-child {
	margin-left:-40px;
}

#left_nav > li:hover > ul > li {
	display:block;
}
<ul id="left_nav">
				<li>TEKST</li>
				<li><a href="#">TEKST</a></li>
				<li><a href="#">TEKST</a></li>
				<li><a href="#">TEKST</a></li>
				<li><a href="#">TEKST</a></li>
					<ul>
						<li><a href="#">TEKST</a></li>
						<li><a href="#">TEKST</a></li>
					</ul>
				<li><a href="#">TEKST</a></li>

 

komentarz 12 stycznia 2019 przez Tomek Sochacki Ekspert (227,510 p.)
jak nie rozwija, co dokładnie chcesz zrobić?
komentarz 12 stycznia 2019 przez adikpl Użytkownik (660 p.)
Chcę aby po najechaniu myszką na TEKST, pojawiła się podlista
komentarz 12 stycznia 2019 przez Tomek Sochacki Ekspert (227,510 p.)
popatrz sobie na przykłady, pierwszy lepszy wynik w google i gotowy przykład: https://codepen.io/andornagy/pen/xhiJH

próbowałes chociaż coś sam szukać... chyba nie co? :)

Kolejny przykład nieco bardziej rozbudowany: https://codepen.io/ahsanrathore/pen/wMRwpZ

google... może naprawdę zdziałać cuda :)
komentarz 12 stycznia 2019 przez adikpl Użytkownik (660 p.)
Patrzyłem na inny przykład.

Nie działa display:block;

Do tego momentu wszystko ok, ale jak ukrywam listę to potem display:block; nie działa
komentarz 12 stycznia 2019 przez Tomek Sochacki Ekspert (227,510 p.)
Przypatrz się swojej strukturze html i sposobie w jaki chcesz sie do niej odwoływać w css bo masz tam błędy.

1 odpowiedź

+1 głos
odpowiedź 12 stycznia 2019 przez lateM Pasjonat (17,660 p.)
wybrane 12 stycznia 2019 przez adikpl
 
Najlepsza
  1. <ul id="left_nav"> - ta lista nie ma zamykającego tagu. 
  2. Jeśli ta druga lista ul ma być zagnieżdżona w pierwszej "left_nav", to musisz ją umieścić wewnątrz <li></li> a nie obok.
  3. #left_nav > ul > li - chcesz, aby po najechaniu pojawiała się tylko ta lista ul, która jest zagnieżdżona, czy elementy li listy #left_nav? Bo aktualnie odnosisz się do ul wewnątrz #left_nav
komentarz 12 stycznia 2019 przez adikpl Użytkownik (660 p.)
Zapomniałem skopiować zamykanie <ul id="left_nav">.

Ale, drugi punkt zadziałał. Dziękuje

Podobne pytania

0 głosów
1 odpowiedź 311 wizyt
pytanie zadane 26 maja 2018 w HTML i CSS przez robiczQ Nowicjusz (190 p.)
0 głosów
1 odpowiedź 692 wizyt
0 głosów
1 odpowiedź 1,781 wizyt
pytanie zadane 29 stycznia 2018 w HTML i CSS przez Kamil Różański Nowicjusz (170 p.)

92,452 zapytań

141,262 odpowiedzi

319,077 komentarzy

61,854 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...