Sidebar out map div

[Valerio De Luca]

Hi eb,
Can I put the Sidebar out of th map div?

I tried, this is my webmap with sidebar inside the map div, everthong works:

www.mainjoin.eu/map/sidebar_in_map_div

And this is the webmap when I put the sidebar out the map div:

www.mainjoin.eu/map/sidebar_out_map_div

But here the point and polygon in map disappear.

My goal is confine the sidebar in a 50% left div:
div id="sideleft" style="width:50%;float:left;"

and confine the map in a 50% right:
div id="map" style="width:50%;float:right;"

Thanks for any tip
Valerio

[touruyo]

Hi Valerio I'd see the code of your webmap, I really liked the layout and the pop-up. I'm implementing turbo's sidebar but then I can't seem to really customize it. Thanks in advance

[Nathan Van der Auwera]

The sidebar should always be put outside of the map div. Because for instance scroll events inside the sidebar panes (on top of the map) will affect the map, and the leaflet controls will not move along (aka they will not remain visible if the sidebar is opened).

But in your code you do not add the sidebar to the leaflet map correctly --you wrote .addTo(sideleft) instead of .addTo(map) which imho causes the error.

Of course this does not solve your original problem: wanting to have a max 50/50 split, but I would imagine you would only need to limit the size of the sidebar pane to max 50% using css? (but I did not try that).