Can somebody tell me what I'm doing wrong? For some reason the image that's being called in the CSS isn't loading over top of the image in the img tag.

Code:
.test {
  border: 1px solid #c00;
}

.over {
  background: transparent url("/images/over.gif" ) no-repeat;
  z-index: 2;
  width: 400px;
  height: 200px;
}

<p class="over"><a href="link.php"><img src="/images/me.jpg" width="400" height="200" class="test" /></a></p>
This is driving me nuts!