WordPress.org

Support

Support » Themes and Templates » How to shadow a whole div

How to shadow a whole div

  • I have a background picture that I like very much. One of the divs over it has text and all I want is the text over the background. The background does bleed some of the text out so what I would like to do is darken shadow the entire div but so you can still see the background underneath. Just like a box shadow. I tried messing with the box shadow variables but haven’t been able to get it to work. Am I missing some CSS attribute that I can do this with?

    Thanks
    Bryan

Viewing 2 replies - 1 through 2 (of 2 total)
  • The standards way

    .shadow {
    box-shadow: 3px 3px 4px #000;
    }

    For Internet Explorer

    .shadow {
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    }

    So combined styles

    .shadow {
    -moz-box-shadow: 3px 3px 4px #000;
    -webkit-box-shadow: 3px 3px 4px #000;
    box-shadow: 3px 3px 4px #000;
    /* For IE 8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
    /* For IE 5.5 - 7 */
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
    }

    [signature moderated]

    http://www.listentothewind.com/temp/example.jpg
    That gives the box shadow but I want to give the whole div widget area a shadow.

    My test site http://www.listentothewind.com/lttw_test

    I want to do this from under the quote to above the footer.

    I want to be able to see the background underneath with the items on top. Now the background is washing out the text. I thought a shadow might fix that. Not an additional background on top. I might have to resort to Photoshop.

    Thanks for the help

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to shadow a whole div’ is closed to new replies.
Skip to toolbar