Leaflet Map Rendering

Question

My map didn't open completely, can anyone help me solve it? enter image description here

I tried to recreate the code and install it again, I tried to get the code from the website itself and it didn't work,I'm using React and TailwindCSS,someone who can help me please ?

Answer 1

In the file where you created your map component, you must import the following styles.

import "leaflet/dist/leaflet.css";

and where you add the Tailwind directives to your CSS you must create the style for the height and width of the map.

@tailwind base;
@tailwind components;
@tailwind utilities;

.leaflet-container {
  height: 500px;
  width: 100%;
}