CODEWITHSUNDEEP
cssfirefox
Unix
Unix

Reputation: 2674

Why is this shadow not working in Firefox?

To be honest, I don't know how to ask this strange behaviour on shadows because I'm using the CSS standards and, by my surprise, it's not working properly:

Take a look at this style:

.light.boxed {
/*  -webkit-box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.03),
        0 0 0 1px rgba(4, 4, 4, 0.06);*/
    -moz-box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.03),
        0 0 0 1px rgba(4, 4, 4, 0.06);
/*  box-shadow: 0 0 0 8px rgba(0, 0, 0, 0.03),
        0 0 0 1px rgba(4, 4, 4, 0.06);*/
}

It's supposed that Firefox Dev Edition displays the shadow taking the values from the -moz-box-shadow, but it doesn't. It displays nothing. It takes the value directly from box-shadow.

Moreover, when I uncomment box-shadow, it displays the shadow on Firefox, BUT when I scrolldown the page, it shows some irregularities in the render; I mean, at some point the shadow is darker, and at the end it's lighter again. It seems that Firefox doesn't render properly the rgba colors (only when the blur parameter is 0 and you have to scrolldown).

shadow](https://i.sstatic.net/KWVQN.png)![shadow

Is it a known bug? Do you know a solution for it?

This is the HTML:

<body class="light boxed"></body>

And more CSS:

.boxed {
    margin: 0 auto;
    width: 1000px;
}

Look an example here: http://jsfiddle.net/gerardbm/d7d4u5rf/ You need to open it in Firefox to see how the shadow doesn't work.

Upvotes: 1

Views: 849

Answers (1)

Alejandro
Alejandro

Reputation: 1216

"Gecko 13 (Firefox 13) removed support for -moz-box-shadow. Since then, only the unprefixed version is supported." Found this here in the Notes sections. Does that help explain the behavior you're getting?

Upvotes: 2

Related Questions