my site only looks good in ie 6 !! :o(

hello,

check out my little photo site at http://blackblack.free.fr/

it looks great in ie 6 : on the index page, if you hover a box, the background turns grey. doesn't do so in netscape and firebird... how can i make it happen in these 2 ?

now, on the "photo gallery" pages (e.g. http://blackblack.free.fr/20031105.html), if you hover an image, the white padding around it turns grey in ie6. in netscape and firebird, it's a mess, there's some kind of grey box protruding from behind the image (wider but less high). how can i make it look good ?

here's my css :

body, div, p, td {
	background: #fafafa;
	color: #808080;
	font: small verdana, arial, sans-serif;
}

body {
	margin: 0;
	text-align: center;
}

a, a:visited, a:active {
	background-color: transparent;
	color: #c0c0c0;
	text-decoration: none;
}

a:hover {
	background-color: #eeeeee;
	color: #c0c0c0;
}

h1#head {
	font-size: x-small;
	margin: 2em 0;
	text-align: center;
}

h1#title {
	font-size: small;
	font-weight: normal;
	margin: 2em 0;
	text-align: left;
}

h2 {
	border: 1px solid #808080;
	font-size: small;
	font-weight: normal;
	letter-spacing: 1em;
	margin: 1em 0;
	padding: 3px 3px 3px 13px;
	text-align: left;
}

h6 {
	font-size: x-small;
	font-weight: normal;
	margin: 2em 0 2em 0;
	text-align: center;
}

img {
	border: 1px solid #808080;
	padding: 3px;
}

#main {
	margin: 0 auto;
	text-align: left;
	width: 500px;
}

#gallery {
	text-align: left;
}

#gallery a:hover {
	background-color: #c0c0c0;
	color: #c0c0c0;
}

#gallery img {
	margin: 10px;
	vertical-align: middle;
}

.menublock {
	border: 1px solid #808080;
	cursor: pointer;
	display: block;
	margin: 1em 0;
}

.menublock img {
	border: 0;
	border-right: 1px solid #808080;
	float: left;
	margin: 0;
	padding: 0;
}

.menutext {
	color: #808080;
	display: block;
	height: 50px;
	padding-left: 1em;
}

thanks in advance for any help !