Graphics in a wide border?

Using a wide border on left

[Wlauzon]

The site I am working on uses a wide (150px) left border and the navigation is in that area.

Is there any way to use a graphic or graphic background for borders without a bunch of positioning?

[Marshall]

One way would be put a what you want in a <div> larger than its content and have the <div> have a background graphic. If you are merely creating a large left border, you could do something like this:

#borderBox {
width: 300px; /* use what is necessary */
height: 300px; /* again, use what is necessary */
text-align: left;
text-indent: 150px;
background: #FFF url(backgroundimage.gif) top left repeat;
}

I think that should achieve what you are looking for.

Marshall

[swa66]

CSS3 has border properties to use graphics as the border.
[w3.org...]

AFAIK only Safari has support for it already.

[Wlauzon]

Yeah, but by the time all the browsers support CSS3 I will be retired :D

I have tried the method suggested above, but it is the same old problem with IE in getting it to stretch to the bottom of the page.

Not sure it is worth spending a lot of time on, been fooling with it for about 2 days, so I might just redesign the layout.