Style change for popup in leaflet

Question

I do a map using Leaflet, and I'd like to change the background color of a popup. I included the following rule to change the color of the popup and popup tip in <style>. Nevertheless, the box changes its color* but the tip (triangle) remains white.
How can I solve it?

    .mypopup.leaflet-popup-content-wrapper{
        background-color: gray;
        opacity: 0.9;
    }
    .mypopup.leaflet-popup-tip {
        color: red;
 }

Answer 1

This is probably more suitable question for Stackoverflow as it is related to CSS and not so much GIS. The solution below should work as the mypopup.leaflet-popup-tip class is still referencing the default CSS background color; in essence your current CSS for mypopup.leaflet-popup-tip class isn't doing anything. I tested this in my browser web dev tools and it worked for me.

.mypopup.leaflet-popup-content-wrapper{
    background-color: gray;
    opacity: 0.9;
}
.mypopup.leaflet-popup-tip {
    background: red;
}