wp-plugin-leaflet-map
wp-plugin-leaflet-map copied to clipboard
bozdoz
Popup width
Is it possible to set width of a marker popup?
I'm trying to add images into a popup but the image is very small. img width=500 doesn't matter, nor do img style="width:500px" (see image 1) div style="width:500px" works but the popup doesn't change in size. (see image 2)
Thanks a lot!
Try
[leaflet-marker iconUrl="..." iconSize="..,.." iconAnchor="..,.." popupAnchor="..,.." lat=... lng=...]
<div style=width:15ch;>some text</div> <br><img style="max-height:15ch;max-width:15ch;object-fit:cover;" src="url of picture" alt="image">
[/leaflet-marker]
You may need to adjust "15ch".
+1 on this. The Popup property maxWidth defaults to 300 in leaflet.js (Leaflet/Popup.js) That in turn gets rendered with an inline style. I have not been able to find a way of overriding this - maybe someone out there can point me in the right direction. Editing a local copy of leafletjs to set the default maxWidth to a large number lets me control the popup width with css. Too ugly.
Also I asked the same question of the leaflet folks and it turns out that it is an ancient compatibility issue.. https://github.com/Leaflet/Leaflet/discussions/8441#discussioncomment-3648170
