A web designer who regularly subcontracts me to prepare various elements for pages they are working on hired me to do a Son of Suckerfish Drop Down Menu. The requested layout was a bit more complex than even the prettied drop down menu version on the site. My requested task involved the use of a background image, borders around the drop downs, and images that formed dividers between each main menu item to essentially make them look like buttons.

As is usually the case with this designer, they requested that my fix work in Firefox, Internet Explorer 6.x and Internet Explorer 7.x. So I went about drafting the proper xhtml and css to create the desired look and functionality. I tested it in each of these browsers and all went as planned. I shipped it to the designer via ftp upload and sat back in satisfied bliss. That is until the end client had a run at it. They use primarily IE7. Problem, when you move the cursor just right, you got a sticky hover on the drop downs. I played and fiddled and figured it had to be the dimensions specified for one of the elements. Finally I gave up and wrote to the css-d list. As you may know, the css-d list is the home to some css gods — many of whom are willing to stoop down and help the lowly of us!

Someone there pointed out that this was a documented issue in IE6, and most often is seen with a click on a drop down item in even the basic Son of Suckerfish in IE7. Mine did not require a click, only a careful mouse movement right at the hover/unhover point.

Fortunately they also pointed me to the solution for a sticky hover in Internet Explorer (solution explained here), simply include this in the hover element the following:
#nav li:hover {background-position: 0 0;}

It worked and my code is repaired.

This brings up another point. I am available for hire to help you on your projects. Do you need help with an html, CSS, mysql, perl or php project? I regularly take on projects on a sub-contracted basis for web designers. Each of these are typical things I do:

• repair broken sites, with a specialization on broken implementations of WordPress Blogs or Expression Engine Sites
• Code PHP, for things like WordPress Sidebars and Widgets
• create the xhtml or html layout and supporting css framework to fit a design that you have laid out in Photoshop, Paint Shop Pro, CorelDraw X3 or12, or other image editing software
• implement mailing lists and counters written in perl
• install OS Commerce for clients to sell their products on the internet
• Install a WordPress Blog or Content Management System for a client and customize one of the hundreds of templates that are available for WordPress
• Improve your coding to enhance your SEO goals enabling your pages to make a move towards the top of the search engines because of cleaner code, compliant code, code that comes in the proper order and code that works in multiple viewing devices
• Do the little things that frustrate you as a designer to free you up to design

Let us be part of your html fix toolbox. If you need a quote just let me know using the contact form to the left side of our pages.

This article was posted on Sunday, April 1st, 2007 at 4:52 am