title: CSS Show Submenu on hover of a href
body: <p>I' am actually badly stuck and can't figure this out. Whenever someone hovers the on 1st level of the link. The 2nd Submenu / Children of current hovered menu should show up. Below are more information. I have been through this type of issues but kind of no brainer at the moment after 40 Minutes of research and trying am here.</p>
  
  <p><strong>HTML :</strong></p>
  
  <pre><code>&lt;ul id="header_topbar_ul"&gt;
      &lt;?php
      global $db;
      $db-&gt;SELECT("SELECT * FROM modules WHERE modules_status='1' AND modules_show_in_menu='1' AND modules_parent_id='0' ORDER BY modules_order ASC");
      if($db-&gt;num_rows()){
          foreach($db-&gt;rows() as $menu){
              $modules_id = $menu["modules_id"];
              $modules_name = $menu["modules_name"];
              $modules_slug = $menu["modules_slug"];
      ?&gt;
      &lt;li id="header_&lt;?php echo $modules_id; ?&gt;"&gt;
          &lt;a href="&lt;?php echo $modules_slug; ?&gt;" title="Dashboard"&gt;&lt;?php echo $modules_name; ?&gt;&lt;/a&gt;
  
          &lt;?php
              $db-&gt;SELECT("SELECT * FROM modules WHERE modules_parent_id='$modules_id' AND modules_status='1' ORDER BY modules_order ASC");
              if($db-&gt;num_rows()){                    
          ?&gt;
              &lt;ul class="submenu"&gt;
                  &lt;?php
                      foreach($db-&gt;rows() as $submenu){
                          $modules_id = $menu["modules_id"];
                          $modules_name = $menu["modules_name"];
                          $modules_slug = $menu["modules_slug"];
                  ?&gt;
                      &lt;li id="header_&lt;?php echo $modules_id; ?&gt;"&gt;&lt;a href="&lt;?php echo $modules_slug; ?&gt;" title="Dashboard"&gt;&lt;?php echo $modules_name; ?&gt;&lt;/a&gt;&lt;/li&gt;
                  &lt;?php
                      }
                  ?&gt;
              &lt;/ul&gt;
          &lt;?php
              }
          ?&gt;
  
      &lt;/li&gt;
  
      &lt;?php
          }
      }
      ?&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><hr/><strong>CSS :</strong></p>
  
  <pre><code>#header_navigation #header_topbar_ul ul.submenu{
      display: none;  
  }
  
  #header_navigation #header_topbar_ul li a:hover ul.submenu{
      display: block !important;
      background: #000;
  }
  </code></pre>
  
  <hr/>