Delete/replace the contents of a div

[grynch]

Hi folks. I have a div with an image in it. I want this to be replaced with a rollover that swaps on mouseover. I thought it would be as easy as deleting the image, and replacing it with an image with a swap image behavior on it. But as soon as I delete the image, the layout goes all wonky.

What's my best way to apply a swap image behavior to an image inside a div?

Sorry for my ignorance on all this!

[rocknbil]

- set an anchor to the width and height of the image
- set the background of the anchor to the image
- on mouseover, swap out the background

#test a {
width: 200px;
height: 200px;
padding:0;
margin:0;
display: block;
background:url(200x200.jpg) top left no-repeat;
}
#test a:hover {
background:url(200x200-mouseover.jpg) top left no-repeat;
}

<p id="test"><a href="some-url.html">&nbsp;</a></p>

May contain errors, but that approach should get you started . . .