Here's a quickie! How do I simulate a (size=5) basic grey TABLE BORDER around an IMG

I had this somewhere in my notes but I can’t find it.

I have a basic table with a <table border=“5”> property – you know, the basic beveled one circa Mosaic :wink: – and I want this identical border around an image. I want to do it inline if at all possible, since it is one of the rare times I am foreclosed from using stylesheets . . . and have to work with tables.

Stripped down, quick 'n dirty, how do I get the image to duplicate the basic grey beveled border without placing the IMG in another table? Thanks guys.

s

Try…

<img src="boat.jpg" alt="Boat" style="width:304px; height:228px; border:5px ridge grey;" />

… hope it helps.

Hey Scout, thanks. It doesn’t perfectly mirror the table border’s size + bevel angles . . . but I think I can mess around with it and get it close. I’ll hunt down “RIDGE” on W3 schools and see what other beveling techniques are available to me.

s

http://w3schools.com/cssref/pr_border-style.asp

  • none
  • hidden
  • dotted
  • dashed
  • solid
  • double
  • groove
  • ridge
  • inset
  • outset
  • inherit

[FONT=Verdana]You might find the SitePoint reference more helpful:

Hey TechnoBear, thanks for that link. Yes, I was able to get it as close as possible using

outline-style: outset;

which had the added advantage that it reconciled the border size to that appearing in the table. It isn’t perfect (I only realized later) because I have padding in that table, creating additional beveling illusions. The one thing I haven’t been able to figure out, however, is the blasted color of the table border.

I don’t suppose there is a reference somewhere as to exactly what color is being used? Because GREY is too dark, and LIGHTGREY is too light. (?)

EDIT:
Another optical illusion! I just fattened both borders and they are the same color. :stuck_out_tongue: The problem (remains) the “pattern” of the bevel, apparent when you explode the size of the border. Back to the drawing board . . .

You can also do two colours for the true 1990’s 3D look :slight_smile:

left and top being one colour, right and bottom being the other. Right out of Windows95