For those of you other than the two of you who remember this website, it used to have a dropline menu. I used one from CSS Play but have never really been happy with it. Sometimes it works and sometimes it doesn’t. The dropline either wouldn’t drop or wouldn’t undrop. Anyway, more on droplines later but for now, I thought I would replace it with a standard dropdown.
I am very inefficient with menus. I have dozens of good ones but can never remember which websites they are on so have to hunt around CSS Play and Dynamic Drive. So, the sensible thing to do would be to get one that would work on all browsers to IE7 and would be eminently styleable. I did buy css3menus which has a variety of styles but if you wanted to modify it (always) the CSS was awful – part linked and part inline.
I picked a default dropdown from Stu Nicholls CSS Menu site – nothing fancy but quite flexible. Those looking at this in a civilized browser will see a bunch of radii with some styled buttons in the middle. Even IE9+ deals with it. But, IE8, what a disaster.
I spent a whole day using CSSPIE and a bunch of other .htc and jquery workarounds with no luck. When radii could be imposed, they had to equal – unlike the end menu buttons on the site.
I would have thought the it would be possible to style a <li>. IE8 had no problem with the menu wrapper or the menu <ul> but it stuck at the <li>. Finally, I removed the radii altogether on IE8.
IE8 usage is down to about 7% which is reflected on my own stats. IE7 – about 3% but what surprised me was IE6 – 6%. Perhaps this is an aberration – I’ve certainly seen it a lot lower and as far as I know, it’s about 1% worldwide other than China which loves it. So what to do?
I haven’t bothered with IE6 for years – if a site looks about right on it or can be made to look about right without spending more than 20 minutes, I’ll acknowledge it. Now, I think, I am going to employ again what I used to do. Put a conditional comment banner across the top of the home page telling the visitor to basically get a life and offering a link to a screendump of the website in a decent browser – plus some links. While I am at it, I’ll use the conditional comments to add IE7.
There are so many elements to make a site interesting that I hate to go back to – basically – tabulated design. Perhaps that’s the answer? Do everything in tables so absolutely every browser will support it. BTW some of the CSS3PIE type hacks involved either adding image corners or blanking image corners. I’m sorry, I refuse to go back to pngs that are a pain to change the colour of.
Back to droplines.
I like these because they are economical with space. All the big news sites use them so there must be a good reason. I love Stu Nicholls’ work on CSS Play, cssmenus, stunicholls.com and istu.co.uk. I am always in awe of his imagination. So, back there I went and ploughed through the droplines.
I discovered one that had a sticky submenu so that when one of the items was active, all the other items in that menu group were always visible. It also highlighted the active submenu item. Not only that but the dropline submenu has a dropdown if a third level is necessary. It required a small donation but considering the inspiration Stu has been, a small price. I think it’s a ‘sliding door’ menu but I’ll deal with the images.
It’s difficult to get a decent colour change on such small images so I create big versions and resize them. A pain in the proverbial.