Create a vertically centred horizontal navigation

Centring block level elements is easy, just define a width and set margin:0 auto;, but what if you don’t know that fixed width? You could use text-align:center;, but that won’t work on 100%-width block-level elements either… that’ll only work on text-level elements.

Multi-level Menus with jQuery and CSS

Lately there have been quite a few requests on Twitter and other places for multilevel menus using jQuery and/or CSS. There are quite a few ways to accomplish this and it largely depends on what your needs are. In this article we’ll take a quick look at several common multilevel menu options and then we’ll […]

Create an Advanced CSS Menu Using the Hover and Position Properties

Tutorial that starts with a photoshop file and finishes with semantic HTML and CSS. You’ll learn how to create an advanced CSS navigation menu using hover and position properties. The finished product will render properly in all major browsers including Firefox, Safari, IE7/IE8, Opera, and Google Chrome. Due to IE6 and its lack of support […]

How to Create a CSS Menu Using Image Sprites

Follow these steps to build your own modern navigation bar design, starting with the initial steps in Photoshop to flesh out the design, then moving on to constructing the HTML and styling with the CSS image sprite technique…

Sexy Drop Down Menu with jQuery and CSS

Studies show that top navigations tend to get the most visual attention when a user first visits a site. Having organized and intuitive navigation is key — and while most drop down menus may look aesthetically pleasing, developing them to degrade gracefully is also essential. This tutorial shows how to create a sexy drop down […]