CODEWITHSUNDEEP
css
Suresh KUMAR Mukhiya
Suresh KUMAR Mukhiya

Reputation: 616

What does it mean by '-moz-transform' depricated?

I have used the CSS below to make speech bubble for my website, Yep Website

It looks okay in google chrome and safari. It does not show up in firefox giving me, '-moz-transform' depricated? I am not good in designing. I want to seek help how to correct this problem. Thanks in advance.

/*SPEECH BUBBLES*/
    .wiget_bottom_all li h3 {
        position:relative;
        padding:15px;
        margin:1em 0 3em;
        color:#fff;
        background:#00B9B7;
        /* css3 */
        background:-webkit-gradient(linear, 0 0, 0 100%, from(#f04349), to(#c81e2b));
        background:-moz-linear-gradient(#f04349, #c81e2b);
        background:-o-linear-gradient(#f04349, #c81e2b);
        background:linear-gradient(#00B9B7, #00B9B7);
        -webkit-border-radius:10px;
        -moz-border-radius:10px;
        border-radius:10px;
    }


    /* THE TRIANGLE
    ------------------------------------------------------------------------------------------------------------------------------- */

    /* creates the wider right-angled triangle */
    .wiget_bottom_all li h3:before {
        content:"";
        position:absolute;
        bottom:-20px; /* value = - border-top-width - border-bottom-width */
        left:105px; /* controls horizontal position */
        border:0;
        border-right-width:30px; /* vary this value to change the angle of the vertex */
        border-bottom-width:20px; /* vary this value to change the height of the triangle. must be equal to the corresponding value in :after */
        border-style:solid;
        border-color:transparent #00B9B7;
        /* reduce the damage in FF3.0 */
        display:block; 
        width:0;
    }

Upvotes: 1

Views: 103

Answers (2)

Trond Hatlen
Trond Hatlen

Reputation: 571

Firefox has probably stopped to support the vendor prefixed css rule. Do you have a not vendored prefixed css rule: transform: ... that will probably do the trick.

According to http://caniuse.com/#search=transform the not vendored prefixed transform rule has been supported in firefox since firefox 19.

edit: You do not use -moz-transform in your example code on s.t. you probably use it somewhere else in your css otherwise the error message really should not be there

Upvotes: 2

Ankura Mainali
Ankura Mainali

Reputation: 34

Seems to have issues with cross browser codes. You can refer to css tricks for cross browser compatible codes. Perhaps, read this.

Upvotes: 1

Related Questions