How to remove rounded corners from leaflet popup

javascript, leaflet, rounded-corners, styles

Solution

you can override the default style by adding !important key word

For example:- put this class inside your page this will over ride the border style

.leaflet-popup-content-wrapper,.leaflet-popup-content
{
 border-radius:0 !important;
}

For multiple browser support

 .leaflet-popup-content-wrapper,.leaflet-popup-content
 {
   -webkit-border-radius: 0 !important;
   -moz-border-radius: 0 !important;
    border-radius: 0 !important;
 }

First thing is that you have to find which tag is making the radius and over ride that class you can use the developer tool for identifying that.

Problem

I want to make the edges of my leaflet popup box sharp (corners) instead of rounded edges. I have downloaded the source `leaflet-src.js` but can't seem to find where the this is happening. Places I've looked for are in the class: ``` leaflet-popup-content-wrapper leaflet-popup-content leaflet-popup-close-button ``` Does anyone know where this is happening?

Original source