Tag: dropdowns

HTML/CSS newbie FAQs

After spending a while on web development forums, you start to see the same questions being asked regularly. So here I’m going to answer some of these common beginner questions and hopefully save me typing answers out repeatedly in the future because I can just refer the poster to here or copy it myself. ;)

More on HTML/CSS newbie FAQs

Centering a dropdown menu

Recently, I needed to create a centered version of the Suckerfish dropdown menu and realised that some significant modifications were going to be needed. This is because the method for getting the top level list items to sit in a row, on the same horizontal plane, is to use float: left. However, when you float elements, you can’t centre them unless you give them a width and use auto left and right margins.

More on Centering a dropdown menu

Dropdown low down


Dropdowns (horizontal) or flyout (vertical) menus abound on websites and come in many different flavours. They are also put together in a number of different ways, some done with javascript, some with ‘pure’ CSS and some a mixture of both.

More on Dropdown low down

Single image replacement rollovers with Suckerfish dropdowns

I discovered two of my most often used CSS techniques at the same place - Petr Staníček’s Wellstyled.com (Staropramen, Budvar, Pilsner Urquell, great CSS techniques - gotta love the Czechs ;) ).

And those techniques are an image replacement (IR) technique that I later found out was actually called the Gilder Levin method and the use of a single image for creating CSS rollovers without the need for preloading images.

More on Single image replacement rollovers with Suckerfish dropdowns

Absolute positioning practical examples

If you’ve read Absolute Positioning Pitfalls, you’re probably wondering when you can use absolute positioning.

Well, I generally find that I use it not for laying large areas of a layout, areas that contain multiple other elements, but rather for positioning individual elements in relation to other elements. (It certainly can be used for creating large layout areas in certain instances, but I’m not going to cover that here.)

More on Absolute positioning practical examples