I have three FABs on a Leaflet map (left-bottom, centre-bottom, left-centre); when I try to add a fourth FAB (in any unused position), the page load fails (no map is drawn but Web Inspector does not report any errors) and the original FABs are moved or jumbled (sometimes on top of each other).
Original (working) FABs:
<div class="fab fab-left-bottom">
<a href="javascript:openLeft();" data-panel=".panel-left" class="panel-open"><i class="fa-solid fa-map-location-dot fa-2xl"></i></a>
</div>
<!--bottom FAB: created in popovers.js-->
<div class="fab fab-center-bottom color-black">
<a href="javascript:otherPages()" class="popup-open"><i class="fa-solid fa-message-plus fa-2x"></i></a>
</div>
<div class="fab fab-left-center color-blue">
<a href="index.html" class="link external"><i class="fa-duotone fa-house-blank fa-2x"></i></a>
</div>