I'm using leaflet.js to create a map of Scotland, with two insets for the Orkney and Shetland groups of islands. This is as far as I've got.
I wish to guarantte that no matter what size the overall map is created, only the portions of the map set using
fitBounds() ever show, and that the size of the insets scale inline with the main
This however is trickier than I thought. If I make the parent div narrower, when leaflet draws the main map, it's not making the height any shorter, it's maintaining the aspect ration by reducing the scaling over all, so that the islands in the insets are showing on the main map.
Also I wanted to guarantee that the scale of the two insets is the same as the main div, but at the moment I'm using
ems in order to have the map scale well on a tablet / mobile phone.
Not sure if the solution lies in the CSS of the
divs or something else.