Create nested menu with PHP, Mysql, CSS

How to create a nested menu ,

Before starting to implement , I would sure that you will understand the PHP, Mysql, HTML and CSS.

1- You have to download this project and try to create the database which you will be able to find in the zip file.
2- Test it on your computer, then if everything is fine please look through with the explanation.

- connection.php is the file to connect to database
- example.php is the file to display the menu
- style.css  the decoration of menu.

*connection.php

 define('DSN','mysql:host=localhost;dbname=db_menu');
 define('USERNAME' , 'root');
 define('PASSWORD' , '');
 try { 
      $DB = new PDO(DSN, USERNAME, PASSWORD); 
  } 
  catch(PDOException $e) { 
       echo $e->getMessage(); 
  } 
 
  try { 
       $sql = "SELECT * FROM drop_down";
 
       $result = $DB->query($sql);
       $row_count = $result->rowCount();
       if($row_count){
       $rows = $result->fetchAll(PDO::FETCH_ASSOC);
       }
  }catch(PDOException $e) { 
       echo $e->getMessage(); 
  } 

*example.php

*menu.css

body {
   font: 15px arial, helvetica, sans-serif;
 }
 ul.multidrop a {
   color: #fff;
   text-decoration: none;

 }
 ul.multidrop {
   padding: 0;
   margin: 0;
   background: #DF5B50;
   float: left;
 }
 ul.multidrop ul {
   padding: 0;
   margin: 0;
   background: #DF5B50;
   float: left;
 }
 ul.multidrop li {
   padding: 5px;
   float: left;
   display: inline;
   position: relative;
   width: 150px;
   list-style: none;
   cursor: pointer;
 }
   ul.multidrop li:hover {
   background: #3EC4F6;
 }
 ul.multidrop ul {
   position: absolute;
   left: 0;
   top: 100%;
   background: #3EC4F6;
   display: none;
 }
 ul.multidrop ul ul {
   left: 100%;
   top: 0;
   background: #DF5B50;
 }
 ul.multidrop li:hover > ul {
   display: block;
   background: #3EC4F6;
 }
 ul.multidrop li ul li:hover {
   background: #DF5B50;
 }

Next trip that related to this post will be published soon.

cheer!