Rozwijane menu główne

pytanie zadane 11 maja 2017 w HTML i CSS przez duqxx Nowicjusz (120 p.)
zamknięte 11 maja 2017 przez duqxx

	<body>
		
		<header>
		
			<h1 class="logo"><a href="index.html">Informatyka</a></h1>
			
			<ul class="socials">
			
				<li><a href="#"><i class="icon-facebook"></i></a></li>
				<li><a href="#"><i class="icon-youtube"></i></a></li>
				<li><a href="#"><i class="icon-twitter"></i></a></li>
				<li><a href="#"><i class="icon-gplus"></i></a></li>

			</ul>
			
			<nav>
				
				<div id="topbar">
				
					<ol class="nav">
				
						<li><a href="#">Home</a></li>
						<li><a href="#">Coding</a></li>
						<li><a href="#">How to start?</a></li>
						<li><a href="#">Tutorials</a>
						
							<ul class="tuts">
							
								<li><a href="#">C++</a></li>
								<li><a href="#">HTML</a></li>
								<li><a href="#">CSS3</a></li>
								<li><a href="#">Java</a></li>
								
							</ul>
						
						</li>
						<li><a href="#">About me</a></li>
						<li><a href="#">Contact</a></li>
				
					</ol>
			
				</div>
			
			</nav>
			
		</header>

#topbar
{
	height: 50px;
	width: 100%;
	text-align: center;
}

.nav
{
	background-color: #08684e;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: center;
	border-bottom: 1px solid #023024;
	height: 45px;
}

.nav a 
{
	color: #fff;
	text-decoration: none;
}

.nav a:hover
{
	color: #069971;
}

.nav > li
{
	float: left;
	text-align: center;
	margin-left: 20px;
	margin-right: 20px;
	padding: 10px 0;
}

.nav > li:first-child
{
	margin-left: 315px;
	
}

.tuts
{
	background-color: #08684e;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: center;
	border-bottom: 1px solid #023024;
	margin-top: 3px;
}

.tuts > li:first-child
{
	margin-top: 5px;
	border-top: 1px solid #023024;
}

.tuts > li
{
	margin-top: 5px;
	padding: 5px;
	border-bottom: 1px solid #023024;
	width: 150px;
	display: none;
	z-index: 100;
	position: relative;

}

.nav > li:hover > .tuts > li
{
	display: block;
	z-index: 100;
	position: relative;
}

Czy mógłby mi ktoś wskazać błąd w tym kodzie? Po najechaniu na opcje na głównym pasku menu się nie wyświetla.

komentarz zamknięcia: rozwiązane

komentarz 11 maja 2017 przez Shaoi Mądrala (7,020 p.)

Ikonki powinny być jako span, nie jako i.

Ponadto powinny mieć: aria-hidden="true".

1 odpowiedź

odpowiedź 11 maja 2017 przez imklau Nałogowiec (42,090 p.)

o nawigację Ci chodzi?
jak najeżdżam na Tutorials to wyświetla się kolejna lista, a więcej nie ma się co wyświetlać przecież.
Czy o jakiś inny problem Ci chodzi?