activate submenu on anchor hover NOT li hover - html

Question

I am trying to activate my sub-menu when hovering on the anchor tag in my ul. It seems to only work when hovering on the li the anchor tag is in. I don't want to restrict the width of my list-items just to get that effect. I've tried several methods like:
a:hover, nav .collapsable a:hover, and removing the "display-block" attributes. Any help will be very appreciated! Thanks
Here is my html:
<nav>
<ul class="collapsable" style="margin-left:-5px; margin-top:-10px;">
<li>Licensing
<ul>
<li>Corporate</li>
<li>Individual</li>
<li>TBA/DBA</li>
<li>Nonresident</li>
<li>Name approval</li>
<li>CSRs</li>
<li>Who needs a license</li>
<li>Duties an unlicensed person can do</li>
<li>Continuing education</li>
</ul>
</li>
<li>Business planning
<ul>
<li>Business plans</li>
<li>Marketing plans</li>
<li>Perpetuation plans</li>
<li>Disaster plans</li>
<li>Local Chambers of Commerce</li>
<li>Dos and don'ts of starting your own agency</li>
</ul>
</li>
<li>Financial planning
<ul>
<li>Accounting</li>
<li>Taxes</li>
<li>Insurance for the agency</li>
<li>E&O</li>
<li>Agency financing</li>
<li>Premium financing</li>
<li>Trust accounts</li>
</ul>
</li>
<li>Sales and marketing
<ul>
<li>Advertising</li>
<li>Agency Marketing Tool Kit, calendar</li>
<li>Signage and business cards</li>
<li>Local community services</li>
<li>Consumer content</li>
<li>PIA Creative Services</li>
<li>Markets</li>
<li>Niche marketing</li>
</ul>
</li>
<li>Office organization
<ul>
<li>Physical space/layout</li>
<li>Furniture</li>
<li>Equipment</li>
</ul>
</li>
<li>Personnel management
<ul>
<li>Job descriptions</li>
<li>Hiring</li>
<li>Testing</li>
<li>Personality and aptitude assessment</li>
<li>Managing</li>
<li>Compensation benefits</li>
<li>Group health, dental, life and long-term disability</li>
<li>Contracts</li>
<li>Employment law</li>
<li>Employee handbook</li>
<li>Time management</li>
</ul>
</li>
<li>Internal workflow
<ul>
<li>Procedures manual</li>
<li>E&O</li>
<li>Coverage checklists</li>
<li>Carrier workflow</li>
<li>Binding authority</li>
<li>Underwriting</li>
<li>Workflow</li>
<li>Privacy</li>
<li>Files</li>
<li>Storage/security</li>
<li>Notices</li>
<li>Cyber insurance</li>
<li>Policy writing/proposal template</li>
</ul>
</li>
<li>Technology issues
<ul>
<li>Agency management systems</li>
<li>Computer hardware</li>
<li>Software</li>
<li>E-mailing/faxing/ electronic filing</li>
<li>Real Time utilization</li>
<li>Emerald Website Design service</li>
<li>Agency Revolution Internet marketing</li>
</ul>
</li>
<li>Reference resources
<ul>
<li>PIA website—<em>Think PIA first </em></li>
<li>PIA National</li>
<li>Insurance Department websites</li>
<li>Department of Motor Vehicles</li>
<li>National Traffic Safety Council</li>
<li>Glossaries of insurance terms</li>
</ul>
</li>
</ul>
</nav>
Here is the CSS:
nav li>ul {
/*display: inline-block;*/
margin: 0;
padding: 0;
}
nav .collapsable li>ul {
display: none;
}
nav li>ul::before {
content: " ";
}
nav li>ul::after {
content: " ";
}
nav li:hover>ul {
display: inline-block;
}
nav li>ul>li {
/*display: inline-block;*/
}
nav li>ul>li+li::before {
content: " ";
}