Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 2 of 2

Thread: shadow drop q's

  1. #1
    Senior Member Karloff's Avatar
    Join Date
    Oct 2005
    Posts
    744
    Member #
    11702
    does anyone know how to create a drop shadow effect on, say, the container box which encloses the web page.

    lets say i have a web page which has a container box 500px wide in the center(that houses all of the text), i know how to create an image with a shadow effect then place it to the side, however if the page size become really big the image cuts off before the bottom of the page ruining the effect. i can only use that for small image box shadows.

    anyone got any good solutions?

    peace out

  2.  

  3. #2
    Senior Member Stylise's Avatar
    Join Date
    Jul 2005
    Location
    Mount Martha, Australia
    Posts
    229
    Member #
    10679
    Slice your image into three parts, a top, bottom and a flowing background image (something at can be repeated along the y-axis).

    Then do the following:


    CSS
    Code:
    #container {
        background: url("path/to/images/container_bg.gif") repeat-y top left;
        width: 500px;
    }
    
    #container:before {
        background: url("path/to/images/container_top.gif") no-repeat top left;
        container: "";
        display: block;
        height: [value]px;
    }
    
    #container:after{
        background: url("path/to/images/container_bottom.gif") no-repeat top left;
        container: "";
        display: block;
        height: [value]px;
    }
    HTML
    HTML Code:
    <div id="container">
        <p>Example Text</p>
    </div>

    That should do it. Any probs just say (haven't tested it, but done it many times before)


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 12:34 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com