Positioning with rollover image.

Need some help! I changed some images in my document to rollover images and adding the rollover images moved my text down. I haven't been able to figure out why adding the rollover changed the postioning, it looked fine when it was a single image.

My first image was left with the text directly to it's right and even with the top of the image, upon chaning the image to a rollover it moved the text down and text is now starts to the left of the bottom of the image.

This is what my line looked like before the rollover:

<p class="paragraph_text"><span class="paragraph_text">
  <img src="assets/photos/inside.JPG" alt="Inside" name="inside_left" width="200" height="150" align="left" id="inside_left" />We know that each of o

after adding the rollover my html now looks like this:

<p class="paragraph_text"><span class="paragraph_text">
  <a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','assets/photos/longwallacc.JPG',1)"><img src="assets/photos/inside.JPG" alt="pumps & accessorries" name="Image13" width="200" height="150" border="0" id="Image13" /></a>We know that each

This is what my style looked like for the image:

#inside_left {
 clear: none;
 float: left;
 padding-right: 5px;
 border: thin solid #006;
 vertical-align: top;
}

I tried creating a new style for the rollover image itself keeping the same styles as I had for the single image but it still has no effects? What can I do to get this to work?