d

Centering single level menus - revisited

Applying a simple method of centering single level variable width, float left menus.




d

Fluid layout with all columns reaching footer

A fluid layout with max/min width, header/footer and multiple percentage columns ALL reaching the footer using NO images.




d

Professional centered dropdown with flyout images

A centered dropdown menu, using the latest centering technique, with flyout images




d

Centered sliding doors dropline, dropdown, flyout

A centered dropline, dropdown, flyout menu, using the latest centering technique, with current selection option




d

A Photograph Gallery - revisited and updated

An update to one of my early gallery demonstrations to bring it up to date using the latest CSS techniques.




d

Cross browser tabbed pages with embedded links - revisited and updated

An update to one of my early 'one page' demonstrations to bring it up to date using the latest CSS techniques.




d

Cross browser tabbed pages version 2

A second version of the tabbed pages with a default page open on entry.




d

Dropline menu with horizontal scrolling images

A dropline menu which uses sliding doors tabs for the top level and a horizontal scrolling dropline which has images and caption.




d

Text OR associated image hover

A CSS only method of hovering over text OR associated images to highlight both AND grey out other images.




d

Total background image change on hover

A CSS only method of hovering over a horizontal menu link to change the whole menu background image.




d

Professional Any Width top and sub levels

A simplified method of producing a centered dropdown and flyout menu with variable widths depending on text content.




d

Professional Any Width flyout menu

A flyout version of the 'any width' dropdown menu.




d

Professional Any Width top and sub levels v2

A restyled version that allows dropdowns and flyouts to the left and right. Centered top level list and different color sub levels. Even works in IE5.5.




d

Professional Any Width flyout menu with over run

A second 'any width' flyout menu, this time with an over run area and gapping between menu items.




d

Professional drop table menu

A dropdown menu that uses a table to hold the dropdown information.




d

Centering unknown width horizontal menus - revisited

After much searching of the web and with the arrival of IE8, I now have a method of positioning horizontal menus of unknown width left / center / right in the containing element.




d

Professional dropdown flyout left/right menu

A dropdown menu with any width sub menus and the option of left or right dropdown/flyouts.




d

Professional multi-column dropdown

A single level dropdown menu with multi-columns, headings and curved corners using sliding doors techniques for the dropdowns.




d

Professional anywidth centered dropdown menu

A single level dropdown anywidth menu with dropdown that are centered beneath the top level links.




d

Professional anywidth centered dropline menu

A dropline anywidth menu with droplines that are centered beneath the top level links which are also centered.




d

Professional anywidth centered dropdown/flyout menu

A multi level dropdown flyout anywidth menu with dropdown and flyouts that are centered beneath the top level links, with the ability to have a left or right flyout.




d

A mixed gallery using the 'object' element

A mixed gallery using just html/css to switch the contents of an 'object'. The content can be text, images, shockwave/flash and quicktime movie.




d

A Dropline, Dropdown and two level Flyout menu

A version 2 of the dropline, dropdown and flyout hybrid menu.




d

An anywidth pullup, flyout menu

An anywidth menu with the top level centered and the sub menus as wide as required with pullup and flyout left/right.




d

A Professional droplist menu

A droplist menu with method of setting the number of columns in each list and the option of a full width bottom bar for extra linking.




d

Mini tabbed pages version 2

A version of my mini tabbed pages with the ability to have a tab open on page entry.




d

Anywidth dropline/dropdown centered

A dropline with dropdown menu which has widths automatiaclly set to suit content, the top level centered and all sub levels centered beneath the parent item.




d

A basic anywidth flyout menu

Back to basics to show how to use the latest techniques to produce a flyout menu with the widths of the sub levels automatically sized to fit the longest text.




d

A droplist menu with a sublist feature

A previous professional droplist menu with the additional feature of a dropline heading with droplists giving extra lists within the same dropdown.




d

A droplist menu with top level images and text/links

A droplist menu using top level blocks containing images with text and links.




d

A fix for a problem with divide lines and sliding doors hover graphics

Fixing a problem when having vertical divide lines between horizontal link and using rollover images.




d

A dynamic CSS image magnifier

A very simple method of magnifying an image using just CSS




d

An image sliding menu

An experimental menu to explore the possibility of having sliding images on hover




d

FINALLY a new CSS only dropdwon meu

Afer all this time there is finally a dropdown menu that doesn't use javascript, table, conditional comments, hacks, extra markup and works in all the major browsers including IE6.




d

New definition list menu

A definition list menu using the new menu system to simplify the styling




d

New vertical slide menu

Using the latest techniques for no hacks menus this is a vertical slide version with all the features of the dropdown menu including tabbing, and the sub list stays open when clicking the top level.




d

New horizontal dropdown menu

For those who prefer nested unordered lists for their menus, again with no hacks, table, conditional comments or javascript.




d

UPDATE to new click to slide vertical menu

Added a click to open and also a reclick to close feature.




d

'max-width' for IE6

A CSS ONLY answer for 'max-width' in IE6. No javascript or Microsoft expressions.




d

A dropdown menu in shades of grey and black.

A dropdown menu with top level centered and sub menus dynamic widths to fit the longest text, and all in shades of grey and black.




d

A vertical slide with current page override.

A vertical sliding menu with current page styling and the ability to override the current page style when hovering other items.




d

A dropdown menu with current page override.

A dropdown menu with current page styling and the ability to override the current page style when hovering other items.




d

Menu link text, png image replacement with rollover that degrades well with images off etc..

A method of replacing menu link text with rollover png images that works in IE6 and also degrades well when images are of and/or CSS is off.




d

A simple image dropdown menu

A simple method of replacing all text with images in a single level dropdown menu with rollover.




d

A more complex image dropdown menu

A more complex method of replacing all text with images in a single level dropdown menu using individual png images.




d

Gallery with sliding thumbnail images

A click gallery using a sliding set of thumbnail images to navigate. The large image is permanently on screen until another image is chosen EVEN when refreshing the page. With descriptive text and linking option.




d

Gallery with vertical sliding thumbnail images

The previous gallery but with the thumbnails arranged vertically instead of horizontal.




d

Image information dropdown menu

A dropdown menu using top level png images with the submenu used for image information.




d

Multi-level, multi-line dropdown menu

A dropdown version of the previous multi-line flyout menu




d

Simple anywidth flyout menu with breadcrumb trail

A simple anywidth CSS flyout menu with an easy method of having a breadcrumb trail.