CSS/HTML 탐색 메뉴의 Safari에 드롭 다운 섹션이 표시되지 않습니다.

Question

기본 탐색 메뉴를 만들려면 다음 코드가 필요합니다. Safari를 제외한 모든 브라우저에서 의도 한대로 작동합니다. Safari의 드롭 다운 섹션은 마우스를 올리면 나타나지 않습니다. Chrome (Windows/Mac/Android), Firefox (Windows/Mac) 및 Internet Explorer에서 작동합니다. 어떤 도움이라도 대단히 감사합니다.

CSS :

ul.topnav { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
    background-color: rgba(93, 93, 93, 0.9); 
    position: fixed; 
    top: 0; 
    width: 100%; 
} 

ul.topnav li {float: left;} 

ul.topnav li a { 
    display: block; 
    color: white; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
} 

ul.topnav li a:hover:not(.active) {background-color: #888;} 

ul.topnav li a.active {background-color: #4CAF50;} 

ul.topnav li.right {float: right;} 


li a, .dropbtn { 
    display: inline-block; 
    color: white; 
    text-align: center; 
    padding: 14px 16px; 
    text-decoration: none; 
} 

li.dropdown { 
    display: inline-block; 
} 

li.dropdown.right { 
    display: inline-block; 
} 

.dropdown-content { 
    display: none; 
    position: fixed; 
    background-color: rgba(93, 93, 93, 0.9); 
    min-width: 221px; 
    max-height: 600px; 
    overflow: auto; 
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); 
} 

.dropdown-content a { 
    color: black; 
    padding: 12px 16px; 
    text-decoration: none; 
    display: block; 
    text-align: left; 
} 

.dropdown-content a:hover {background-color: rgba(93, 93, 93, 0.9)} 

.dropdown:hover .dropdown-content { 
    display: block; 
} 

HTML : 그것도 대답은 ul.topnav에서 내 오버 플로우 규칙을 제거하기 위해 다른 사람이었다 도움이 경우

<ul class='topnav'> 
    <li><a href='index.php'><img class='menu' src='images/CMmenu.gif' height='19px'></a></li> 
    <li class='dropdown'> 
     <a href='#' class='dropbtn'>Certifications</a> 
      <div class='dropdown-content'> 
      <a href='index.php?id=all'>--View All Departments--</a> 
      <other links here....using PHP> 
      </div> 
    </li> 
    <li class='dropdown'> 
     <a href='#' class='dropbtn'>Employees</a> 
      <div class='dropdown-content'> 
      <a href='view_employees.php'>View/Edit</a> 
      <a href='add_employee.php'>Add</a> 
      </div> 
    </li> 
    <li class='dropdown right'> 
    <a href='#' class='dropbtn'>My Account</a> 
    <div class='dropdown-content'> 
    <a href='user_settings.php'>Account Settings</a> 
    <a href='logout.php'>Logout</a> 
    </div> 
    </li> 
    <li class='dropdown right'> 
    <a href='#' class='active dropbtn'>Admin</a> 
    <div class='dropdown-content'> 
    <a href='view_cert_type.php'>View/Edit Certification Types</a> 
    <a href='add_cert_type.php'>Add Certification Type</a> 
    <a href='view_depts.php'>View/Edit Departments</a> 
    <a href='add_dept.php'>Add Department</a> 
    <a href='admin_users.php'>View/Edit Users</a> 
    <a href='add_user.php'>Add User</a> 
    <a href='org_settings.php'>Organization Settings</a> 
     </div> 
    </li> 
</ul> 

Answer 1

.