Forums

Give help. Get help.

  • # February 26, 2013 at 6:39 pm

    hello, I have a question for css3 gradients
    is there a unified code that would work
    atleast for mozila, webkit and presto(opera)
    without need for each engine to use their prefixes

    I ask because I want this gradient to work for all browsers:


    background-image: -o-linear-gradient(bottom, rgba(26,64,176,0.8) 0%, rgba(79,165,240,0.8) 100%);



    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, rgba(26,64,176,0.8)), color-stop(01, rgba(79,165,240,0.8)) );

    these 2 do the same, but they each use their own code and prefix
    and this annoys the hell out of me

    so what would be unified code of these 2, that would work for all 3 browsers ?

    # February 26, 2013 at 8:42 pm

    I still don’t get it, can you please look at the code?
    my gradient goes down, and with % i have defined where color(s) stops
    but it won’t work at all on any browser…
    is there something I’m missing?


    background-image: linear-gradient(to bottom, rgba(26,64,176,0.8) 0%, rgba(79,165,240,0.8) 100%);

    I can’t find any reliable tutorial online for unified code
    for such simple example -_-

    # February 27, 2013 at 8:29 am

    As far as I know, -khtml- is pretty much useless in any case.
    Regarding -ms-, a bunch of things are unsupported by IE9, and prefixless in IE10, leaving this prefix far more used than required.
    -o is meant to die one day or the other.
    And Mozilla Firefox and Chrome are doing their best to unprefix properties as time goes.

    # February 27, 2013 at 10:13 am

    hmm, you all maybe missed my problem :)

    I don’t wish to use prefixes for each browser engine
    I wish to have 1 line(d) code (universal) that covers mozila,webkit,presto
    I understand that prefixes are used to have compatibility with older versions
    but by now they all should work under 1 code, or am I wrong ?

    # February 27, 2013 at 10:17 am

    >or am I wrong?

    Yes…you are.

    So, you can’t do it with a simple CSS file.

    You might want to look into : http://leaverou.github.com/prefixfree/

    # February 27, 2013 at 10:20 am

    SASS and COMPASS! :D

    # February 27, 2013 at 11:24 am

    > I don’t wish to use prefixes for each browser engine I wish to have 1 line(d) code (universal) that covers mozila,webkit,presto I understand that prefixes are used to have compatibility with older versions but by now they all should work under 1 code, or am I wrong ?

    And I wish unicorns pooping rainbows could exist.

    You can’t please all rendering engines with a single line when it comes to non-standard properties.

    Prefixes are not here to guarantee compatibility with older versions. They are here to inform the developer he’s using an implementation from a rendering engine which may or may not behave properly.

    Once a property becomes a standard, vendors progressively remove the prefixes, leaving an unprefixed property (e.g. border-radius). Then developers keep using prefixes to make sure old versions still understand the property until they are not used anymore (e.g. Firefox 3.6).

    # February 27, 2013 at 12:21 pm

    > And I wish unicorns pooping rainbows could exist.

    no need to be rude :)
    I thought that gradient already was “made” standard, hence why I searched unified code for all

    because I noticed some code from 2011 made for webkit doesn’t work for webkit anymore
    same for mozilla, and I found this frustrating, especially if web dev’s have to
    keep track always what is proper code per year and what not -_-

    # February 27, 2013 at 12:23 pm

    >web dev’s have to keep track always what is proper code per year

    Yes they do….it’s part of being a developer.

    # February 27, 2013 at 1:13 pm

    > no need to be rude :)

    I didn’t mean to be rude. My bad. :)

    # February 28, 2013 at 4:38 pm

    because trident(ie) mozilla(ff) safari/chrome(webkit) and presto(opera)
    all 4 have different code to write, nothing simmilar

    I’d gladly trade 1 line code that works for all 3 or 4 than this annoyance :P

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag