HTML & CSS
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 -- 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.
<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.
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
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. (?)
Another optical illusion! I just fattened both borders and they are the same color. 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
left and top being one colour, right and bottom being the other. Right out of Windows95
This topic is now closed. New replies are no longer allowed.