a href round div not working in ie7 and ie6

[colinod]

i have the following div on a page the link works fine in ie8 and above but in 7 and 6 i do not get the hover finger and the link does not work

any ideas

<a href="news2.asp?id=386&voicetype=All" name="386">
<div class="newsitem">
         <div class="newstxtright"><img src="http://bytes.com/submit/images/newstext/rupert degas.png" border="0"></div>
        <div class="artistboysnewsleft"><img src="http://bytes.com/submit/images/pix/rupertdegas.png" name="boysnewsimg" border="0" class="boysnewsimg">
        <div class="boysnews">Rupert<br>Degas</div></div>
</div></a>

this is the css for the divs on the page

/* start news */
#newslist {
	margin: 0 auto;
	width: 840px;
	top: 180px;
	/* [disabled]background-color: #FFF; */
	padding: 5px;
}
.newsitem {
	width: 800px;
	border:#ef007b;
	border-style:solid;
	border-width:thin;
	height:155px;
	margin-top: 15px;
}
.artistboysnewsright  {
	/*border: 1px solid #f39617;*/
	width: 85px;
	height: 130px;
	float: right;
	margin-top: 7px;
	margin-right: 7px;
	margin-bottom: 7px;
	margin-left: 7px;
	padding-top: 10px;
	text-align: center;
	
}
.artistboysnewsleft  {
	/*border: 1px solid #f39617;*/
	width: 85px;
	height: 130px;
	float: left;
	margin-top: 7px;
	margin-right: 7px;
	margin-bottom: 7px;
	margin-left: 7px;
	padding-top: 10px;
	text-align: center;

}
.newstxtleft {
	float: left;
	margin-top: 17px;
	padding-left: 10px;
}
.newstxtright {
	float: right;
	margin-top: 17px;
	padding-right: 10px;
}
.boysnews {
	background-image: url(../images/newfrontpage/b.gif);
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	font-weight:bold;
	color: #000000;
	text-decoration:none;
}
.girlsnews {
	background-image: url(../images/newfrontpage/f.gif);
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	font-weight:bold;
	color: #000000;
	text-decoration:none;
}
.kidsnews {
	background-image: url(../images/newfrontpage/k.gif);
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	font-weight:bold;
	color: #000000;
	text-decoration:none;
}
.boysnewsimg {
	top: -9px;
	width: 82px;
	height: 82px;
}
.girlsnewsimg {
	top: -9px;
	width: 82px;
	height: 82px;
}
.kidsnewsimg {
	top: -9px;
	width: 82px;
	height: 82px;
}
/* end news */

this is the page in question

http://www.yaketyyak.co.uk/newpages/news.asp

thanks

[Frinavale]

You cannot put a <div> within an <a>.
Use a <span> instead and set the span's style to "display:bl ock" so that it behaves like a <div>.

-Frinny

[colinod]

ok i have changed it slightly and put the <a> within the outer <div>

<div class="newsitem">
<a href="news2.asp?id=386&voicetype=All" name="386">
         <span class="newstxtright"><img src="../images/newstext/rupert degas.png" border="0"></span>
        <span class="artistboysnewsleft"><img src="../images/pix/rupertdegas.png" name="boysnewsimg" border="0" class="boysnewsimg">
        <span class="boysnews">Rupert<br>Degas</span></span>
        </a>
</div>

still does not work though??