Plugin Author
bozdoz
(@bozdoz)
You could use this or something like it in your CSS:
.leaflet-map {
height: 200px !important;
}
@media only screen and (min-height: 500px) {
.leaflet-map {
height: 400px !important;
}
}
Thread Starter
Gncfrsh
(@agencefrsh)
Thank you for your help. 🙂
It’s the only way to have a full-height map with the plugin ?
Because your code is not responsive, unless if I insert media queries for each screen size.
(Furthermore, with this code, the container’s height changes but not the map’s height.)
Plugin Author
bozdoz
(@bozdoz)
Right; the map will need to trigger a refresh somehow on resize. So, that means there would need to be a javascript component to this as well. Something similar to what is described here would need to happen: https://stackoverflow.com/questions/24412325/resizing-a-leaflet-map-on-container-resize
Plugin Author
bozdoz
(@bozdoz)
alternatively, perhaps you could try using viewport height instead of percent for height:
.leaflet-map {
height: 100vh !important;
}
Thread Starter
Gncfrsh
(@agencefrsh)
It works! 🙂
In a small screen, the map zoom remains in the same level so my map is too big but I think we can’t change that depending on window size…
Thanks a lot for your help and for your nice plugin!
