One of the questions people have frequently asked me, is how do I center the menu. My answer to all have been that I do not know how to do this in CSS, as the list element occupies the full width of its container. So the only way would be to manually set the width of the list element.

The other day I started thinking that this could be done dynamically by using javascript. Of course some people will probably not like this method, so you should stop reading now.

I have created 3 examples, for people using either MooTools, jQuery or just plain JavaScript, you can see them below as well as examples.

Please note that all 3 examples require that you set the ID of the containing div element, this is so that a background image can be added to this element.

Update while writing
Of course while writing this tutorial, I found an article which explains how to do this using CSS, but since I had already written the tutorial, you will get all 4 examples.
Read the rest »

Wow, in little over a year 50.000 zip files have been downloaded, that is just crazy, well anyways, it is crazy to me.

Thanks for the use, which I take as an indication of support for the service.

Below is a screenshot of, so that you can see the individual download stats.

Downloads on CSS Menu Builder from Jul 1st, 2008 till Nov 12th, 2009

A set of 9 sub-domains have been created with the goal of speeding up the delivery of the various menu images around the site.

All images are cached on the server and depending on which type of image is requested, it will be delivered by the appropriate sub-domain.

This is a part of CSS Menu Builders attempt in following the best practice rules set forth in an article on the same subject by Yahoo, a link is provided below.

In the future it would be cool to add all the static menu images to one file, as this would drastically decrease the requests made by the site, but there is still some way to go, before this is even attempted.

Best Practices for Speeding Up Your Web Site

Note:
Headers are set for the images, so the first time, it might take a little time to load, but then they should be cached in your browsers as well. Headers are set for 1 week and then they should revalidate.

After a long absence I have come back to build a new version of the CSS Menu Builder page, you might not notice that many design changes, but on the menu builder pages things have changed a bit.

In a time where many have focus on performance, I decided to do the same, granted there are still a few issues that need to be fixed to comply with more points on the Yahoo best practice list, but they will come.

Here is a list with a few of the performance enhancements that have been added.

• CSS and Javascript minification.
• CSS and Javascipt caching.
• Javascript code reduction.
• Image caching.
• File size reduction.

Here is a list of new features added to the new CSS Menu Builder structure.

• Builder broken up into multiple segments to increase performance and usability.
• Fixed Zip file download errors in Safari under OS X and IE 8 under Windows.
• Added link builder to create links for your menus, they support drag & drop for positioning.
• Uses cookies to remember you last menu, next time you come back (Cookie is saved for 1 year).
• Breadcrumb menu now has built-in support for Breadcrumb NavXT WordPress plugin, by removing the span tag within the anchor tag.

Future features, without promising to much, as happened last time I wrote a post looking at the future.

• Javascript, css and image files will be distributed on sub-domains to increase performance, using browsers multiple domain request features as described in Yahoo’s best practices for speeding up websites.
• Better image caching on the various sub-domains.
• Horizontal Menu Zip file and Breadcrumb Menu Zip file will include templates for WP Menubar and Breadcrumb NavXT WordPress plugins.
• All images will have alpha transparent background, so that you may remove the background image from the css and allow for seamless integration into your designs, where it is not possible to build a menu background.
• Menu Image generator scripts will all be updated to use the new Builder Class, which should increase performance and future maintenance.

I hope that people will like these enhancements and will continue to use CSS Menu Builder in the future.