Here is the Materialize code I am working with:
<ul id="dropDownFacultyList" class="dropdown-content" >
<li><a href="#">Wart</a></li>
<li><a href="#">Tart</a></li>
<li><a href="#">Bart</a></li>
<li><a href="#">Cart</a></li>
<li><a href="#">Dart</a></li>
<li ><a href="#" >Fart</a></li>
<li><a class="dropdown-button" href="#" data-activates="dropDownGoaList">
Goa Campus</a>
<ul style="overflow: visible;" id="dropDownGoaList" class="dropdown-content sub-menu" style="left:0px">
<li><a href="#">Deal</a></li>
<li><a href="#">Meal</a></li>
<li><a href="#">Kill</a></li>
<li><a href="#">Bill</a></li>
<li><a href="#">Sill</a></li>
<li ><a href="#" >Neal</a></li>
</ul>
</li>
</ul>
The submenu is functioning correctly but appears misaligned.