I am experiencing an issue with my horizontal menu bar code.
The menu bar displays correctly for the resolution 1366 x 768,
but when I press the ctrl - shortcut key and reduce the browser size using the same shortcut key, my menus move down. I have tried both em and px units to address this problem but it doesn't seem to resolve it. It's important that the menu bar remains in the center, like the other elements on the page, and expands to fit the 960px wrapper setting. I need assistance in solving this issue.
Below is the source code:
HTML
<nav>
<div class="nav_wrapper">
<div class="menu_box">
<div id='cssmenu'>
<ul>
<li><a href='index.php' class="active"><span>Home</span></a></li>
<li><a href='#'><span>About Us</span></a></li>
<li><a href='#'><span>Courses</span></a>
<ul>
<li><a href='index.php'>AGP Program</a></li>
<li><a href='index.php'>Web Program</a></li>
</ul>
</li>
<li><a href='#'><span>Partners</span></a></li>
<li><a href='#'><span>Consultancy</span></a></li>
<li><a href='#'><span>News n Events</span></a></li>
<li><a href='#'><span>Gallery</span></a></li>
<li><a href='#'><span>Contact</span></a></li>
</ul>
</div>
</div>
</div>
</nav>
CSS
/* CSS rules go here */