Dragging button isn't in the middle of the map

[hejustbrave]

and my code is:

[zhenyu-123]

text-align: center;

[hejustbrave]

您好，您的邮件本人已经收到，谢谢！

[claudiobogossian]

i had the same problem, make sure map dimensions are updated using map.invalidateSize() before enable sideBySide control.

[hejustbrave]

您好，您的邮件本人已经收到，谢谢！

[Aqulia]

I have the same problem，please tell me the solution about it ，thank you！！！！

[hejustbrave]

您好，您的邮件本人已经收到，谢谢！

[claudiobogossian]

I have the same problem，please tell me the solution about it ，thank you！！！！

After page load, make sure to invoke map.invalidateSize() before enabling sideBySide control.

[Aqulia]

I have the same problem，please tell me the solution about it ，thank you！！！！

After page load, make sure to invoke map.invalidateSize() before enabling sideBySide control.

I tried, but it didn't work. I control the opening and closing of the roller shutter function through a button. But adding the above code is completely useless

[claudiobogossian]

We invalidate only after page load... Not when the tool is activated.

https://user-images.githubusercontent.com/3015977/231895100-dff76e18-9a26-498b-b2cc-ff4d1e5c089f.mp4

[Aqulia]

We invalidate only after page load... Not when the tool is activated.

Sorry，I still don't understand when I should call this method, meaning after initializing the map object? Or before loading each layer?I tried both separately, but both failed

[hejustbrave]

now coding with vue，the control seems work normal，my code as the layers added before setting to the control

[iamtekson]

I solved the issue by overwriting the default CSS as below,

.leaflet-sbs-divider {
  margin-left: 10px !important;
}

[hejustbrave]

您好，您的邮件本人已经收到，谢谢！