Need to add drop shadow around wrap

Homepage › Community Forums › Legacy Theme Support › Need to add drop shadow around wrap

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 24, 2013 at 4:40 pm #2919
    Terri
    Customer

      Hi Wes,

      I have a prospective new client who wants to use the Legacy theme, but wants me to add a drop shadow around the wrap AND add what she calls a “ribbon” around the navigation menu so that the site will “have a 3D effect” (I love how people try to explain things to me) just like this site — http://www.beaconpointewai.com/

      I made a 1200 px wide blur background image, but that didn’t work for me.  So, I need serious help with putting a drop shadow around the wrap, and the bottom corners on the nav…probably with a nav background image?  Please…. and thank you.  🙂

      Oh, and about the other issue from a couple of days ago:  Changing the bottom Posts to Pages on Optimal.  He thinks he might go with a different design altogether… and he tells me  this AFTER I just put in 40 hours in 3 days to in order to meet his deadline.

      Terri

      February 24, 2013 at 9:19 pm #2921
      Eric
      Customer

        If you’re trying to place a shadow around the wrap, you’ll first need to add a width (if you haven’t already). Then you can apply the css to it. Here is how the other site you linked to is doing it – box-shadow: 0 0 20px #333333;

        You can also Google how to add box-shadows. I came across this – http://css-tricks.com/snippets/css/css-box-shadow/ and there are plenty more.

        I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

        February 24, 2013 at 11:01 pm #2923
        Terri
        Customer

          Hi Eric,I’ve Googled ’til the cows came home, read dozens of How To’s, and tried at least a half dozen different box-shadow CSS code.   My last attempt placed a box-shadow around body (or #inner, if placed there)  but not around the entire content area including the slider and welcome message.

          -webkit-box-shadow: 0 30px 2px #5a5a5a; box-shadow: 0 1px 30px #5a5a5a;

          I’ve tried placing it in wrap, and in inner, and somewhere else, but can’t seem to capture the ENTIRE content area like in the above referenced website.  Maybe I’m not placing it in the correct place?

          Terri

          February 25, 2013 at 11:01 am #2931
          Eric
          Customer

            Yeah that’s the correct way to do it. It should work if you’re adding it to the wrap or inner (whichever one you want), it works fine for me.

            No matter where you place the code, the shadow should at least show up around the ID or Class you assign it to.

            I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

            October 2, 2015 at 3:08 am #16517
            ephraimdov
            Customer

              More about…….CSS Shadow

              Dov

              October 6, 2015 at 10:06 pm #16555
              Eric
              Customer

                @ephraimdov Thanks for sharing, I’ll make sure and re-share that if another user needs it.

                I create awesome sites for awesome people! Contact me if interested – ericsanchez1585@gmail.com

              • Author
                Posts
              Viewing 6 posts - 1 through 6 (of 6 total)
              • You must be logged in to reply to this topic.