MY THUMBNAILS APPEAR DIFFERENT IN BROWERS. HOW DO I MAKE IT THE SAME?

Question

Hey Friends,
My thumbnails for my portfolio page are links to the actual designs. They are placed in a table and the table is divided up into columns and rows for the thumbnails.
The problem is when I view the thumbnails on different browsers for example Opera and Safari it looks different. In Safari it looks the same as I designed it in Dreamweaver but in Opera it spaces the thumnails out. All I want is to have a border around each thumbnail that is equal on the top, left and sides but cant figure it out and to make it the same regardless of browers..I HAVE ATTACHED A SCREENSHOT OF HOW THE THUMBNAILS PREVIEW IN THE DIFFERENT BROWSERS. I have tested other sites in both browsers and they get it right. What am I doing wrong?
Is there a step I am missing when I insert thumbnails and adding links to a thumbnails. I have taken all the borders off of the links. Is that right?
HAVE A look below...
Can anyone please help me? Any help would make me so happy
regards
Wesley

Answer 1

Bemdesign is right.  Web design is nothing like print design. There is no reason to lose sleep over this slight rendering difference.  But you could style your images with CSS borders & padding.
This CSS code will add 15px of uniform padding & 2px borders to ALL images on the page.
img {padding: 15px; border: 2px solid silver}
Or, if you wish to style thumbnails only, try this in your CSS:
.thumbs {padding: 15px; border: 2px solid silver}
And add the thumbs class to your HTML image code like so:
<img class="thumbs" src="some_image.jpg" >
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists
www.alt-web.com/
www.twitter.com/altweb