Mobile Friendly Website


Doing it with style

A menu with overrun COMMENTS

Welcome to my Comments Pages

Please note. I get a few hundred emails a week from visitors asking for help, or posing questions on how to modify my demos to suit their application and I read them all. Unfortunately I only have a limited amount of time to spend answering these questions.

So if I do not reply, please do not be offended, and if I do reply then you are one of the lucky ones.

If you are asking for permission to use any of my demonstration then please email me with your request stu{at}

Post a comment

Current posts

ah, ok. that sucks.
how dows the overrun thingy work? i'm no css expert and it would be great with some explaination on how it's done.. ;)
(13.01.2007, 13:37)

sowl, the overrun is achieved with just a little padding around each dropdown <ul>
padding:0 3em 3em 3em; with a transparent background image to make it invisible.
(13.01.2007, 15:20)

Ste McCarten:-
I feel like I'm missing something here. The demo on this site works fine in IE6 but if I copy and paste the CSS and HTML into a blank web page on my local computer it doesn't work in IE6.

Is something that's required in an external CSS file Stu?
(16.01.2007, 22:30)

Ste McCarten, it will work 'straight out of the box' but you must be using a standards compliant doctype. Also check that the conditonal comments are still in place in the source code.
(16.01.2007, 22:37)

Ste McCarten:-
Ah, thanks Stu.

I was using a Firefox extension for viewing source code and this was messing with the formatting when I was copying the HTML.
(17.01.2007, 12:52)

Ben Collins:-
I love your website and I have learned a ton from your CSS examples. Thank you so much for posting them free of charge. I would love to use it on a website that I am redesigning and will gladly contribute a donation if I can get it working. That leads me to...

I am trying to use your "CSS only drop-down menu with overlap and overrun" example, but if you remove the css_play stylesheet from the header section, then the 5th menu item drops down to a second line. Is there anyway you could make the menu "stand alone" in that everything it needs would be included in the CSS definition in the HTML file header? I've tried moving things around, but I haven't had any luck in getting it to render correctly.

Thanks for any help you can offer! Sorry if you get this post in another section, but I can't seem to find it anywhere so I'm going to post again.
(30.01.2007, 14:55)

This version is the one I like best, but it's missing an important feature that was available in earlier versions:
The ability to make submenus display on the left side of the dropdown. It was achieved using a class named "left".
Without this feature, the rightmost submeny will not be visible on some computers with low screen resolution.
I tried copying the "left"-class from a previous version of the menu, but that didn't solve the problem.
How can I fix this?
(13.02.2007, 12:48)

Hi Stu,

Very impressed by this use of CSS. But when I have tried to use it myself I've run into some issues with Sarari that I can't find a solution for.

Basically what happens is the first menu item you hover over causes it to dissappear. The other items remain. Then with the lists that appear they leave a staining effect (part of the list stays on the screen) when you mouse off.

Any ideas?
(28.06.2007, 08:19)

I noticed that in this demo, as the menu opens, some of the menu items have larger height than others, depending how much text needs to be dislayed. Which variable should be set to allow this variable height?

(30.07.2007, 11:44)

Hello, I would like to use a menu in my blog, but I dont find the css file in the page of the menu, how can I find it?

Sorry of my english, I am spanish
(07.08.2007, 18:21)

10 of 35 comments (part 1). [ » ] [ * ]


Your comment:

Your Name:

Stu's First Name - 3 letters (required)

Thanks to Alex for this script.

Please enter your comments for this site page.
Please note that all posts are moderated.

Posting rules

HTML is turned off
Maximum word length is 80 characters.
Messages limited to 1200 characters.
Web links should not include 'http://'


Your donations keep CSS PLAY running.
If your donation is for the use of a demo then please email me with the demo url after making your donation.


Facebook Twitter rss feed Facebook Fan Page