Dropdown Menus - One at a time

[trackdude]

Hi,

Need some help with dropdown menu. I have about ten menus in a row for dropdowns but the menus won't drop individually. They all drop at once no matter which menu I hover over.

Is there a way to have the menus only drop individually????? Here's the URL of my work if you want to see what I've done. <http://tfresultsserver.epizy.com>

Thanks

[dsonesuk]

This will target ALL class names that use 'dropdown-content'

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

While this will target first direct child parent element within it only, with class name '.dropdown-content', not including child elements of that element  with same class name.

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

Edited April 7, 2019 by dsonesuk

[dsonesuk]

You are also missing closing div elements

	<div class="dropdown">
  <button class="dropbtn">1900</button>
  <div class="dropdown-content">
    <a href="http://tfresultsserver.epizy.com/1900%20Season/1900_2_12_.pdf">Feb-12-1900</a>
    <a href="http://tfresultsserver.epizy.com/1900%20Season/1900_2_17_results.pdf">Feb-17-1900</a>
    </div><!-- for class .dropdown-content -->
	</div> <!-- MISSING  for class .dropdown elements-->
	

[trackdude]

4 hours ago, dsonesuk said:

You are also missing closing div elements

 

	<div class="dropdown">
  <button class="dropbtn">1900</button>
  <div class="dropdown-content">
    <a href="http://tfresultsserver.epizy.com/1900%20Season/1900_2_12_.pdf">Feb-12-1900</a>
    <a href="http://tfresultsserver.epizy.com/1900%20Season/1900_2_17_results.pdf">Feb-17-1900</a>
    </div><!-- for class .dropdown-content -->
	</div> <!-- MISSING  for class .dropdown elements-->
	

 

OK, that seem to do the trick. Many thanks. Being self-taught, there's just way too much I don't fully get. 👍🙏