Box-shadow - black in Chrome, but white in Firefox?

Question

In fact, the problem is simple, my shadow is black in Google Chrome and white in Firefox, it should be black. And if you have different comments, tell them because I'm still a student.

This is my HTML code: (this is Dutch, but it's just that you can see anarchy.)

<div class="rechts">
    <h2>IN DE SPOTLIGHTS</h2>
    <p>Zondag 13 oktober beginnen we met ons nieuwe jaar! We starten om 13u30 en iedereen is natuurlijk meer dan welkom! KSA Scherpenheuvel is ook te vinden op <a href="https://www.facebook.com/pages/KSA-Scherpenheuvel/1065425993472427?fref=ts" style="color: black">facebook</a>!</p>

    <h2>FOTOMOMENT</h2>
    <p><img src="images/groepsfoto.jpg" width="400px" alt="foto niet beschikbaar" /><br /> Groepsfotooooo!</p>

    <h2>EXTRA</h2>
    <p><a href="baby.html" style="color: black;">babysitter nodig</a></p>
</div>

my css code for div with class rechts:

.rechts{
    position:absolute;
    right:10px;
    top:500px;
    background-color:#4CAD5D;
    width: 450px;
    border-radius:4px ;
    box-shadow: 0 10px 7px #fff;
    -webkit-box-shadow: 0 10px 7px black;
    -moz-box-shadow: 0 10px 7px black;
    text-align: center;
}

Answer 1

You have box-shadow, and then the same with vendor prefixes. The first shadow box has a white color in it.

Change this:

.rechts {
    box-shadow: 0 10px 7px #fff;
    -webkit-box-shadow: 0 10px 7px black;
    -moz-box-shadow: 0 10px 7px black;
}

For this:

.rechts {
    -webkit-box-shadow: 0 10px 7px #000;
    -moz-box-shadow: 0 10px 7px #000;
    box-shadow: 0 10px 7px #000;
}

# 000, .

Answer 2

, : IE:

-webkit-box-shadow: 0 10px 7px black;
-moz-box-shadow: 0 10px 7px black;
box-shadow: 0 10px 7px #fff;

, box-shadow is #fff, . ( ..) , .

box-shadow: 0 10px 7px #000; ( black #000), .