CSS - image border

Here are two bits I’m using:

TD {
background: #ffcccc;
color: #000000;
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
}

and

IMG {
border-style: solid;
border-color: #black;
border-size: 10px;
}

I’ve got an image in a table cell and I want this image to have a nice thick border. Got the code above from a tutorial somewhere but I can’t figure out why it’s not showing the border the way I want it to. The only other thing I thought of that could be keeping my border from showing up is the width of my cell and the size of the image but even after adjusting them, still no border.

I know we’ve got at least one CSS guru here; any ideas appreciated!!!

“Border-size” and “#black” are both invalid.

Here’s what you want:

img { border: 10px solid black; }

If you want only images within table cells to have the border, then

td img { border: 10px solid black; }

But be careful. The browser might resize your image, thinking not that a 50px x 55px image has a 10px border all the way around (making it a total of 70px x 75px), but that everything should be 50px x 55px, shrinking your image down to 30px x 35px.

Thanks Cranky! You get 100 guanxi for that!

[quote]But be careful. The browser might resize your image, thinking not that a 50px x 55px image has a 10px border all the way around (making it a total of 70px x 75px), but that everything should be 50px x 55px, shrinking your image down to 30px x 35px.
[/quote]

Okay, I’ll try fixing it and then see what it looks like. :slight_smile:

I should have made it easier for you with the sizing. Instead of

<img src="braxton.gif" WIDTH="468" HEIGHT="60" alt="blah blah blah" />

use

<img src="braxton.gif" alt="blah blah blah" />

Then you shouldn’t have the resizing problems.