Rollover - IE7 incompatable

programming web dev
1

My rollovers only work in FF and not IE7. Some dudes in another forum said that I didn’t define these in the correct order:


a:link
a:visited
a:hover
a:active

He said that all of them must be defined somewhere in that order. But my code only needs to change hover. Where do I define the others without changing their default settings?


#nav dl {					/* scoot links down */
	padding-top: 15px; 
}

#nav dt {					/* links stack left to right */
	float: left;
}

#nav dt a {					/* specify link heights */
	display: block;
	height: 0px !important;
	height : 17px; 
	padding: 17px 0 0 0;
	overflow: hidden;
	background-repeat: no-repeat;
}

#nav dt a:hover {			/* icon is lighted on hover */
	background-position: 0 -17px;
}

#nav dt#home,				/* specify which image is associated with the home link */
#nav dt#home a { 
	width: 68px; 
	background-image: url(interface/home.gif); 
}

#nav dt#play,				/* specify which image is associated with the play link */
#nav dt#play a { 
	width: 53px; 
	background-image: url(interface/play.gif);
}

#nav dt#vote,				/* specify which image is associated with the vote link */
#nav dt#vote a { 
	width: 54px; 
	background-image: url(interface/vote.gif);
}

#nav dt#submit,				/* specify which image is associated with the submit link */
#nav dt#submit a { 
	width: 78px; 
	background-image: url(interface/submit.gif);
}

#nav dt#learn,				/* specify which image is associated with the learn link */
#nav dt#learn a { 
	width: 63px; 
	background-image: url(interface/learn.gif);
}

#nav dt#talk,				/* specify which image is associated with the talk link */
#nav dt#talk a { 
	width: 50px; 
	background-image: url(interface/talk.gif);
}

#nav-shadow {				/* the drop shadow of the navigation */
	background: #d1d1d1 url(interface/header_shadow.gif);
	height: 10px
}

body.home dt#home,			/* highlights text and icon of the current page (specified in <body class="whichPage">) */
body.home dt#home a,
body.home dt#home a:hover,
body.play dt#play,
body.play dt#play a,
body.play dt#play a:hover,
body.vote dt#vote,
body.vote dt#vote a,
body.vote dt#vote a:hover,
body.learn dt#learn,
body.learn dt#learn a,
body.learn dt#learn a:hover,
body.talk dt#talk,
body.talk dt#talk a,
body.talk dt#talk a:hover,
body.submit dt#submit,
body.submit dt#submit a, 
body.submit dt#submit a:hover {
	background-position: 0 -34px;
}