Border problem using tables

[Applebrown]

This is a simple website I'm working on but am having trouble with a
seemingly simple border:
www.sunbadgeco.com/sunmetal/bordertest.htm

This is how the 6px wide border (represented by the 1,2,3's below) around
the content (c) currently appears. You'll notice the 2's stretching and not
the 3's--a one px wide/high transparent .gif--as I intended:

12222322221
2 ccccccccc 2
2 ccccccccc 2
3 ccccccccc 3
2 ccccccccc 2
2 ccccccccc 2
12222322221

This is how I **want** the border around the content (c) to appear
graphically. The 1's and 2's should be locked in place, and the single
wide/high pixel.gif 3's should stretch to the length or height of the
content.

12333333321
2 ccccccccc 2
3 ccccccccc 3
3 ccccccccc 3
3 ccccccccc 3
2 ccccccccc 2
12333333321

The 1's are corner .gif's obviously. The 2's are .gifs that I want
stationary with 22 width, 6 high on the horizontal, and 14 height, 6 width
for verticals, but are actually the ones to stretch <grrr>. The 3's are the
single wide/high gif that I want stretched.

Can anyone help? Feel free to e-mail applebrown_@_gamebanshee_._com or post
here. Thanks.

 

[Whitecrest]

www.sunbadgeco.com/sunmetal/bordertest.htm

Are there people that can actually see this?

 

[Els]

Are there people that can actually see this?

I can see it. And read it.
I can even read the grey text on the pages the menu links
too... But I have one of those really accurate color monitors.

 

[Lauri Raittila]

This is a simple website I'm working on but am having trouble with a
seemingly simple border:
www.sunbadgeco.com/sunmetal/bordertest.htm

You are doing it quite complex way

This is how the 6px wide border (represented by the 1,2,3's below) around
the content (c) currently appears. You'll notice the 2's stretching and not
the 3's--a one px wide/high transparent .gif--as I intended:

12222322221
2 ccccccccc 2
2 ccccccccc 2
3 ccccccccc 3
2 ccccccccc 2
2 ccccccccc 2
12222322221

This is how I **want** the border around the content (c) to appear
graphically. The 1's and 2's should be locked in place, and the single
wide/high pixel.gif 3's should stretch to the length or height of the
content.

The 1's are corner .gif's obviously. The 2's are .gifs that I want
stationary with 22 width, 6 high on the horizontal, and 14 height, 6 width
for verticals, but are actually the ones to stretch <grrr>. The 3's are the
single wide/high gif that I want stretched.

Tables aren't easy.

Learn CSS. It will be much easier:

div, div div {background: url(horz.gif) repeat-x;}
div div div, div div div div {background: url(vert.gif) repeat-y;}
div div div div div {background: url(top-left.gif) top left no-repeat;}
div div div div div div
{background: url(top-right.gif) top right no-repeat;}
div div div div div div div
{background: url(bottom-left.gif) bottom left no-repeat;}
div div div div div div div div
{background: url(bottom-right.gif) bottom right no-repeat;}

<div> <div> <div> <div> <div> <div> <div> <div>
ccc...
</div></div></div></div></div></div></div></div>

With 3 corner images in the same image of course. Untested as I didn't
have such images. If you use div for something else too, better use some
classes. If someone suplies me such images, I'll make a testcase...