Forums

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

Home Forums CSS I have 2 separate gradients for 2 different divs.. Only the first one renders

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #34635

    And they aren’t showing up in Chrome or Safari — haven’t tried IE yet.

    Heres the code:

    #ribbon {
    top: 0;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 30px;
    /*background: #cc5500; fallback for older/unsupporting browsers */
    background: #cc5500;
    -moz-box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
    box-shadow: 0px 5px 10px rgba(0,0,0,0.3);
    background: -moz-linear-gradient(left, #a03e14, #562305 20%, #a44015 40%, #a44015 100%);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#a03e14), color-stop(20%, #562305), color-stop(40%, #a44015),color-stop(100%, #a44015);

    }

    #utilities_nav {
    height: 30px;
    width: 100%;
    background-color: #a44015;
    background: -moz-linear-gradient(left, #a44015, #d75900 20%, #d75900 40%, #a44015 100%);
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#a44015), color-stop(20%, #d75900), color-stop(40%, #d75900),color-stop(100%, #a44015);
    }

    It doesn’t seem to matter which one comes first, it’ll do the first but not the second in Firefox.

    Any guidance appreciated

    #88480

    http://wwwtest.utexas.edu/work/cr/3rd-level-template/2nd-level-header.html

    here, I just posted it. Where would I find the most recent syntax? Do you have a recommendation?

    Thanks!

    #88485

    I found the correct syntax on Sitepoint, thanks for the clue! It’s working now.
    I changed it to -webkit-linear-gradient and the same syntax as for the -moz and it works now.

    thank you Paulie_D.

    #88486

    and cnwtx :)

    #88513
    chrisburton
    Participant

    Chrome 2+ & Safari 4+
    -webkit-gradient(linear…

    Chrome 10+ & Safari 5.1+
    -webkit-linear-gradient

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