Build A Full-Width Centered Navigation Bar
Right around the time I was developing the code for the Super Simple Navigation Bar I wrote about a while back, a friend came to me with an interesting problem. He needed a horizontal navigation bar like the one I was creating, with the following changes: 1. The navigation bar background should stretch the full width of the screen (not just the width of the centered content area), but 2. The navigation elements themselves should still be centered over the content area.

---

Horizontal Navigation Bar
With this code you will learn how to make horizontal navigation bar using CSS.

---

Creating a website navigation bar with CSS
There are many ways to create a navigation bar, you can use a programs like Photoshop and then convert the image into code, but when I see people creating them in Photoshop I think why bother? When you can simply use CSS for the whole creation and code of it. In this tutorial I will show you how to create a very clean navigation bar that will use one line of XHTML and the rest will be CSS.

---

CSS Navigation Bar
Here I'll teach you how to create a navigation bar. This has been cross browser and cross OS tested, so functionality should not be an issue.

---

Creating a Navigation Bar with CSS
This interesting tutorial in HTML and CSS will show you how to create a Navigation Bar. It takes 16 steps, but they are short and easy to read. The great photos and screenshots make each step very understandable. Thanks to CSS, you can format your links with any style you choose and and can align your links horizontally or vertically. Also, using CSS instead of images to create a rollover effect helps your page load faster.

---

How to Add Google Custom Search Box in Navigation Menu
We all know navigation of a website gives more impression to the readers. Most of the people want important things like search box, categories in navigation. In this tutorial I am going to explain how to add google custom search box in navigation bar.

---

Vertical Navigation
This tutorial will cover different tips and tricks on creating the vertical navigation bar.

---

Tabbed Navigation
This tutorial will teach you how to make a tabbed navigation for your site using lists and css.

---

Navigation Menu
This is simply going to teach you how to do your navigation like the one from our site.

---

Creating your own website top bar
Top bar's seem to appearing on more and more websites each passing day. I have always quite liked the idea and with some XHTML and CSS you can also create your own top bar. Using it for whatever purpose you want it for.

---

Navigation With Lists (Vertical)
This easy to understand tutorial shows you how to create navigation with lists.

---

CSS Navigation
In this tutorial I am going to show the basics of using CSS to create easily manipulated navigation.

---

Image Sprite Navigation With CSS
Creating a navigation with Image Sprites.

---

Overlapping tabbed navigation
A tutorial showing how overlapping tabbed navigation is possible in CSS and can be cross-browser compatible, accessible and javascript free.

---

CF Navigation Menu II
This is an inverted version of the original CF Navigation Menu. Four images are used as part of its interface- the two round corners, an indented divider between menu links, and a gradient background image spanning the menu.

---

CSS Navigation Menus
Are you looking to create navigation menus using CSS? Are you looking to use different styles for your navigation menus? This tutorial will teach you how to create different menu styles for a main menu, submenu, and footer menu.

---

CSS Navigation Menu
How to create a stylish, lightweight navigation menu for your website, using CSS and two images.

---

Chrome Menu Bar
This is a lightweight "chrome" looking CSS menu bar. The menu uses two variants of the same background image to create the hover effect.

---

A Guide to Cleaner and Faster Coding
One of the simplest ways to speed up and clean up your coding is to learn CSS Shorthand. In order to fully grasp shorthand, it is helpful to already have a decent knowledge of CSS. I have put together a simple guide to bring you into the world of CSS Shorthand.

---

Removing the annoying bottom scrollbar in a browser
In a browser window you will have two ways of scrolling the webpage content that is produced, using a vertical scroll bar also known as the y-axis scrollbar and the horizontal scrollbar also known as the x-axis (Sort of like the axis on a typical two axis graph) Depending on how a website is designed you may or may not see it, and sometimes it has been forced to appear as maybe that certain website needs it to function properly. But for some of you out there you may think whats this annoying scrollbar doing here's and no matter how many widths you change it's determined to stay Well with this CSS Hack/Trick you will be able to hide that annoying horizontal scroll bar with a simple CSS code.

---

Scroll Bar Colors
Put color in that scrollbar.

---

Coloring the scrollbar
How can I color the scroll bar of my Web page.

---

3 column theme
This post will help you create a three column site containing a header, navigation, three columns and a footer. The design you are about to use is a basic layout for a simple site. I have used pixels for the dimensions. This is not my preferred method as I use em which is relative to the font size, and in my opinion much better. However, you will need a clear understanding of the basics before attempting to make your sites dimensions relative to the font size.

---

Scroll Bar Colors
Learn how to customize scrollbar colors.

---

Text Rollovers
These are great for aiding the user in navigation while not slowing the loading of your page through image flip rollovers.

---

Define Page Scrollbar Styles
Before we look into Page Scroll Bar definition, please have a look at the example here. Well it does not look that good, but that is just for the differentiation of the areas of the scrollbar. Once you know which area is defined with which code you can modify it as you like.

---

Navigation With Lists (Horizontal)
To start off we need to use a basic list code. I have wrapped the list up inside a div because it makes it a lot easier to customize the entire list.

---

Expandable/Collapsible Content
Sometimes content itself, not presentation or navigation, brings a subtle usability challenge. When page text is unavoidably long and complex, the mass of material can lead to confusion through a loss of context.

---

Coding an Accessible Navigation
In this part of the tutorial I will guide you through coding the image created in part 1 of the tutorial.

---

Slanted Divider Menu
It's an elegant CSS menu bar that uses a transparent "slanted" image to act as a divider and separate each menu item.

---

Holy Grail 3 Column Layout in CSS
Three columns. One fixed-width sidebar for your navigation, another for, say, your Google Ads or your Flickr photos and, as in a fancy truffle, a liquid center for the real substance. Its wide applicability in this golden age of blogging, along with its considerable difficulty, is what has earned the layout the title of Holy Grail

---

CSS Image Sprites Tutorial - Create Multiple Buttons with Graphic Rollovers
Image sprites can be a great way to create graphic rollovers and cut down on your bandiwdth. Here is an in depth, well illustrated tutorial on how to use them to create a navigation.

---

Accessible Graphical Menus
When designing a web site, it's generally a good idea to keep your sites navigational elements text-based. This has several advantages, like being search engine friendly and easily accessible to screen readers and hand-held devices. Let's face it, though, sometimes that's not always practical and what the site design really calls for is a nice menu comprised of graphics in which the actual menu text is stylized. So, here's a little trick that will give you the best of both worlds. We're going to build a graphically-based navigation menu out of an unordered list.

---

Positioning
This tutorial describes how to make a point of placing every item on your page exactly where you want it and make that placement exactly the same on every browser your page is viewed in.

---

Shorthand Properties of CSS
Have you ever seen a CSS stylesheet with multiple attributes applied to the one property and wondered how it's done? Let's go through it and make your stylesheets that much better. By looking through this article you will not only save time styling your website, you will also make sure the page is a lot faster loading your website is judged within the first five seconds of someone visiting it

---

Invisible Objects
Use CSS's visibility property to make objects or elements on a page invisible. Normally this feature is pointless, but it is an excellent way to improve your search engine rankings. This enables you to add or restate search terms on your page that are related to your site's topics, but make them invisible to visitors.

---

Link Effects
Learn how to make your links flip vertically when you go over them.

---

Make a Fixed Banner
This tutorial will eventually give the effect that Popup blockers come up with when they block something.

---

CSS and Scrollbars
How to make lovely colourful scrollbars as they complement the look of the site beautifully and most importantly.

---

Ways of Enhancing the HR Tag
Make your pages load quicker, and more cross browser compatible by using CSS to define your HR tags. Control there color, size weight, possition and more.

---