Need some help with css..

[DionLieb]

Hi I have a slight issue I have a php code that gets data from the database and populates the sections in a unordered list

it works fine but as soon as I coded the css it went south and in the <li> that shows a sub menu only shows one record and does not show the rest

but without the css it shows all the records in the sub menu

please could someone help

doit.php

[kicken]

The HTML you're generating with your PHP code is invalid. Think about how your code is going to process and what it's output will be in the end. Use the view-source feature of your browser to inspect the output and ensure it's correct.

 

Given your current code, if you had no rows in the admin_menu table, you'd end up with HTML that looks like:

<nav class='main-nav'>
    <ul class='main-nav-ul'>
</nav>

Your closing </ul> tag is missing because it's only printed if you found rows. You should probably only be printing your opening <ul> tag under the same circumstances so they always match up.

 

If you have multiple rows in your asub_menu for a given parent, then your HTML would look like this:

<nav class='main-nav'>
    <ul class='main-nav-ul'>
        <li><a href='#'>Site Design</a>
            <ul class='secondUl'>
                <li id='secondli'>
                <a href='#'>Menu Management</a>
                </li>
            </ul>
        </li>
        <ul class='secondUl'>
            <li id='secondli'>
            <a href='#'>Banner Management</a>
            </li>
        </ul>
        </li>
    </ul>
</nav>

You close the parent <li> when you print the first child item. As a result your second and further items are no longer children of your parent in the HTML structure. You also end up printing an extra </li> tag for every child beyond the first.

 

Your code will also generate multiple id="secondli" elements which is not valid, ID's must be unique within a document.

 

You need to make sure that as you build your PHP code you place your echo's in such a way that the resulting HTML is properly structured and valid.

 

Once you're generating proper HTML then see if your CSS works and if not adjust it from there.

[DionLieb]

 this is what I have got so far while playing around and it seems to have worked

I am new to coding and have only started around 4 months ago so I work by trial and error

but if there is a better method to do this please advise as I want to remove the php code and have it populate with Ajax

<?php
include "../../the_database/connect_db.php";
echo "<nav class='main-nav'>";
echo "<ul class='main-nav-ul'>";
	$menu_query = "SELECT * FROM admin_menu";
	$run_query = mysqli_query($con,$menu_query);
		if(mysqli_num_rows($run_query) > 0){
			
			while($row = mysqli_fetch_array($run_query)){
				$m_id = $row["amenu_id"];
				$m_name = $row["amenu_name"];
					echo"<li class='has-sub' ><a href='#'>$m_name<span class='sub-arrow'></span></a>";
				$sub_query = "SELECT * FROM asub_menu where parent_id = '$m_id'";
				$run_query2 = mysqli_query($con,$sub_query);
				if(mysqli_num_rows($run_query2) > 0){
			while($row2 = mysqli_fetch_array($run_query2)){
				$sub_name = $row2['asub_name'];
					echo "<ul>";
					echo "<li id='secondli'>";
					echo "<a href='#'>$sub_name</a>";
					echo "</li>";
echo "</ul>";
			}
					
					echo "</li>";
		}
		
		}
			echo "</ul>";
		}
	echo'</nav>'
?>