How to ensure map displays correctly within Avada's tabs?

I am using the Avada website builder to create a tab layout displaying the different police districts of Milwaukee. The maps display perfectly on their own, but when put into a tabs the first tab displays correctly, but the rest look like this: Example of funky map I read that leaflet struggles sometimes with maps that are hidden and then shown and I have seen some solutions (such as adding js to redraw the map after being initialized). I unfortunately don't know how to apply that to Avada, and/or I am doing something wrong. HERE IS THE CODE(this is the template I work off of--I replace IDS & such for individual districts.) If it's relevant, the ID tabs follow this convention: #fusion-tab-district1, #fusion-tab-district2, and so on (to 7). I looked at this: Leaflet map not displayed properly inside tabbed panel I can't tell if I'm misunderstanding or it's conflicting with Avada. Let me know if there is anything else I can provide to help.

Comment (0)

You’ll be in good company