Horizontal CSS Navigation Menu Tutorial Released
Horizontal navigation seems to be all the rage these days, especially across the Web 2.0 sphere, so today we’re releasing a new tutorial that covers the development of a horizontal navigation bar using XHTML and CSS.
![]()
I’m using the Pixelshell navigation bar as the example, and will walk you through all the steps I took to implement it—so if you want to discover a technique for making horizontal navigation bars, or are interested in how the Pixelshell navigation was created, check out the: Creating a Horizontal CSS Navigation Menu tutorial.
Comment by Myles de Bastion — Sep 15, 2007 @ 6:02 pm
Excellent guide.
I enjoy observing site design trends evolve, and indeed it seems that the preferred way to lay-out the site wide navigational links is now a horizontal bar above or underneath the page’s banner.
Consider using PHP for larger site projects and seperate the nav bar code into it’s own file so you can easily add or change links without having to go through each page seperately for the update.
PHP allows you to deliver a dynamically generated HTML file to each visitor to your client. Perhaps that will make a good guide Dmitry?
Comment by dmitry — Sep 15, 2007 @ 6:12 pm
That’s a good idea Myles. We actually use PHP here, and have the navigation bar code separate in a header.php file. The code is the same as outlined in the guide, just separated away from the content to avoid duplication, but as you say, this is a discussion for another guide :)