Shadowed Backgrounds/Containers

A List Apart. Not hard to find if you’d looked. ??

Yes, I’ve seen that before … but I’m talking backgrounds here not images.

@gregor: If you look at the way this forum is done, you might get a good idea of the method.
Here is the line in the CSS that creates the shadowed left and right columns you see here:
#bling {
background: url(images/bg-3.gif) repeat-y center top;
}
and the image looks like:
https://www.www.ads-software.com/images/bg-3.gif

Yes true. But our guy being a purist is obviously after a pure css solution.
Goto google.

Ummmm…what LL posted *is* a pure CSS solution. It’s *purely* using the background tag of CSS. I’ll never understand why people incorrectly believe CSS=no graphics??? The idea of CSS is to separate style from content/semantic markup. Background images are style…pure and simple.

yep, a repeating background-image is what you’re after. If you want it on three sides (or four, whatever) or you want one on the bottom, you’d use a footer div’ with a drop shadow image in it. same for a header.

@ tecervo. I just knew you’d be here :-). Welcome. I just think that a lot of folks seem to want to go the whole nine yards. The easy solution would be – well – easy! No fun at all.

Anon,
Yeah, I hear that alot…not just here. But I still don’t get it. I think a lot of folks are very confused as to what the “whole nine yards” really are, that’s all. Just like the tables for data argument…there are those that *insist* tables shouldn’t be used *ever*…even for data (and that’s just plain wrong.)
Anyway, back to the topic at hand, a repeating background for the drop shadow effect works great (for fixed width layouts, anyway.)

Fixed width? Therein lies the rub.

Background shadows can be easily done on flexible width layouts as well.

here is a link taht may be an idea for wha tyou are looking for
https://www.saila.com/usage/shadow/

@faewench .
thanks for mention saila.com ………nice site

With the greatest of respect to allusion, it is true that shadows can be used just about anywhere. But this blog for example uses a single graphic. By definition that is fixed. Fluid layouts bring with them a whole additional layer of complexity. The benefit of allusion’s method here is simplicity.

I can’t get this to work. What am I doing wrong? I added the above code to my stylesheet but nothing happens.

Could someone please post the URL, that was posted a month or so back, to the repository of repeating background images like the one used on this page? I am creating a new theme and recall that was a great resource. Thanks!