WordPress.org

Ready to get started?Download WordPress

Forums

Shadowed Backgrounds/Containers (16 posts)

  1. gregor
    Member
    Posted 10 years ago #

    They're all over the place! I'm wondering if someone can locate a tutorial regarding shadowed backgrounds or pages that have a drop shadow effect. Here's an idea of what I'm after (the background only):
    Andy Budd (the right and bottom drop shadow)
    Happy Cog (probably just a centred, y-repeating transparent gif, right?)
    Powazek (same as above ... but what if I wanted that on 3 sides?)
    Thanks!

  2. Cena
    Member
    Posted 10 years ago #

    A List Apart. Not hard to find if you'd looked. ;)

  3. gregor
    Member
    Posted 10 years ago #

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

  4. Laughinglizard
    Member
    Posted 10 years ago #

    @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:
    http://www.wordpress.org/images/bg-3.gif

  5. Anonymous
    Unregistered
    Posted 10 years ago #

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

  6. tcervo
    Member
    Posted 10 years ago #

    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.

  7. francey
    Member
    Posted 10 years ago #

    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.

  8. Anonymous
    Unregistered
    Posted 10 years ago #

    @ 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.

  9. tcervo
    Member
    Posted 10 years ago #

    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.)

  10. Anonymous
    Unregistered
    Posted 10 years ago #

    Fixed width? Therein lies the rub.

  11. Matt Mullenweg
    Troublemaker
    Posted 10 years ago #

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

  12. faewench
    Member
    Posted 10 years ago #

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

  13. WildDuck
    Member
    Posted 10 years ago #

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

  14. Anonymous
    Unregistered
    Posted 10 years ago #

    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.

  15. DJ
    Member
    Posted 9 years ago #

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

  16. Harper
    Member
    Posted 9 years ago #

    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!

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags

No tags yet.