SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member
    Join Date
    Apr 2009
    Posts
    22
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    New to CSS, New to the Site, Shadows

    I know this should be probably easy, but I am new to both CSS and this site. I am a BABY, take it easy on me

    What I want to do is a shadow on my databox that sits on the background. I know this can be done in CSS which is fine. How can I do this? Something like this--

    Ug.. I can use a link because I am new and my attachment needs approval. Hmm. How can I show you???

    How about this--

    BackgroundShadowDataBoxShadowBackground
    Attached Images Attached Images

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,788
    Mentioned
    158 Post(s)
    Tagged
    3 Thread(s)
    Hi,

    Welcome to Sitepoint

    If the element is a fixed width you could slice the shadow as a wide strip and about 5px high and then repeat it down the y-axis of the element.

    For instance on this layout the coloured shadow effect is created with this one image while all the columns are created with this one image.

    Here is another example that uses this image for the side shadows and then just caps the top and bottom with more images.

    Just view source as the code is in the head.

    If the layout is s fluid width then you would need 2 wrappers and apply one side shadow to each wrapper. have a look here for the technique required.

    If you want 100% high fluid shadows then things get more complicated but I have an article here that shows how.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •