Aside-links

Vi laver en menu eller ul med links ti aside området:
Skærmbillede 2013-05-30 kl. 22.36.48

aside ul { 
	list-style: none;
 
}
aside li { 
	margin: 0 5px 5px 0; 
}
aside li a { 
 
	background-color: purple; 
	padding: 10px; 
	width: 238px; 
	display: block; 
	text-decoration: none; 
}
 
 
aside li a:hover {  
		background-color: #666; 
 
}
 
/***med pseudo-class selector   :nth-child(nummer-på-child) kan man fx ændre farve på et specifik li-tag***/
 
aside li:nth-child(2) a:hover {background-color: blue; width: 238px;}
aside li:nth-child(4) a {background-color: green; width: 138px; background-image:url(Frog.png); background-repeat:no-repeat; padding-left:110px;} 
aside li:nth-child(4) a:hover {background-color: blue; width: 138px;}
 
 
/*--------speciel typografi i aside-området-------------------------*/
 
h1.aside {
	font-family: Arial, Helvetica, sans;
	font-size: 1em;
	color: #fff;
	line-height: 1em;
	margin-bottom:0em
}
p.aside {
    	font-family: Arial, Helvetica, sans;
	font-size: 0.75em;
    	color: #fff;
	margin-top:0em
 
}

Leave a Reply