Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Drop Shadowing Correctly

  • This topic is empty.
Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #41273
    ManOfBliss
    Participant

    Hello,

    My current drop shadow is looking like this:
    [http://www.becomealivinggod.com/catalog/newindex3b.html](http://www.becomealivinggod.com/catalog/newindex3b.htmlhttp://www.becomealivinggod.com/catalog/newindex3b.html”)

    I want it to look like this:
    [http://www.apple.com/mac/](http://www.apple.com/mac/http://www.apple.com/mac/”)

    My current CSS code is this:
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    border-radius:3px;
    -moz-box-shadow:7px 3px 10px -7px #888, -7px -3px 10px -7px #888;
    -webkit-box-shadow:7px 3px 10px -7px #888, -7px -3px 10px -7px #888;
    box-shadow:7px 3px 10px -7px #888, -7px -3px 10px -7px #888;

    And I can’t figure out how to make them match.

    Please help! Thank you.
    Timothy

    #116848
    Watson90
    Member
    #116850
    Paulie_D
    Member

    Inspect Element in Chrome shows

    box-shadow: rgba(0, 0, 0, 0.3) 0 1px 3px;

    http://codepen.io/joe/pen/uiqhD

    #116853
    Watson90
    Member

    Add this to your bodyBox class;

    box-shadow: 0px 1px 3px #888;
    -moz-box-shadow: 0px 1px 3px #888;
    -webkit-box-shadow: 0px 1px 3px #888;

    #116855
    Paulie_D
    Member

    @Watson90

    You mean:

    -moz-box-shadow: 0px 1px 3px #888;
    -webkit-box-shadow: 0px 1px 3px #888;
    box-shadow: 0px 1px 3px #888;

    Always gotta put the unprefixed last. :)

    …and does #888 = rgba(0, 0, 0, 0.3) ?

    #116856
    Watson90
    Member

    Dammit! I always get confused about that. Must remember: **Unprefixed last** **Unprefixed last** **Unprefixed last**

    #116857
    Paulie_D
    Member

    Take a Demerit and sit in the corner!

    ;)

    #116879
    ManOfBliss
    Participant

    OMG works like a charm. Looks outstanding. Thank you!

Viewing 8 posts - 1 through 8 (of 8 total)
  • The forum ‘CSS’ is closed to new topics and replies.