html dropdown not working in wordpress website

i have a website in wordpress, thenter link description here

there is a section in the footer of the websiite like in the below image:

i want to make this section a dropdown , so i added the following changes to this section:

        .dropdownme {
  position: relative !important;
  display: inline-block !important;
}

.dropdownme-content {
  display: none !important;
  position: absolute !important;
  background-color: #f1f1f1 !important;
  min-width: 160px !important;
    height:500px !important;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2) !important;
  z-index: 9999999 !important;
}

.dropdownme-content a {
  color: black !important;
  padding: 12px 16px !important;
  text-decoration: none !important;
  display: block !important;
}

.dropdownme-content a:hover {background-color: #ddd !important;}

.dropdownme:hover .dropdownme-content {display: block !important;}

.dropdownme:hover .dropbtnme {background-color: #3e8e41 !important;}

<div class="ltx-footer-social" id="naari" style="margin-top:10%; ">
<div class="container">
<div class="row ">


<div class="col-lg-3 col-md-6 col-sm-6 dropdownme">
<div class="col-lg-3 col-md-6 col-sm-6 dropdownme">
<a href="#" target="_blank" class="item dropbtnme" data-mh="ltx-social-footer" style="height: 98px;">
<span class="icon fa fa-map-marker"></span>
<span class="header">Wanna Reach Us?</span></div>
 <div class="dropdownme-content">
    <a href="#">Link 1</a>
    <a href="#">Link 2</a>
    <a href="#">Link 3</a>
  </div>
</div>

</div>
</div>
</div>

when i did the section outside of the website, in aplain page, its working fine, but when added to the website the dropdown function not working, can anyone please help, thans in advance

Answer

.vc_section Class are overflow hidden. That’s why your Dropdown not showing.If you fixed this class then your problem will be solve.

Advertisement

Answer