Mobile Friendly Website

CSSPLAY

Doing it with style

Pro dropline 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}cssplay.co.uk.

Post a comment


Current posts

BillyG:-
Nice work as usual Stu.
(07.09.2007, 20:20)

Andy:-
...also fine on Safari 3.0.3 (Mac)
(07.09.2007, 21:43)

Bruce:-
The menu "breaks" when I try to resize the text in Firefox 2.0.0.6. Increasing text-size by any amount is causing the sub-menu to duplicate, and it remains duplicated even when text-size is reduced to normal.
(08.09.2007, 18:12)

Stu:-
Bruce, this is a 'bug' in Firfox. The sub-line that is visible in the second an third examples wraps on to a second and third line as you would expect, but it does not return to the original state. There is no duplication of submenu items.
All that is necessary is to refresh the page and Firefox will correct its error.
(08.09.2007, 19:18)

Bruce:-
Yes, obviously the actual submenu items aren't being duplicated. But these are to be used as professional menus and even a minimal increase in text-size affects the menu in FF. It's just an undesirable given the popularity of FF and we can't expect visitors to refresh the page after they resize text. Hopefully the new updates to FF will stop this being an issue with your pro menus ;)
(12.09.2007, 18:12)

Stu:-
Bruce, let's hope so :)
I have always thought that enlarging text only is the wrong way to go with modern websites and much prefer the 'Opera' way of enlarging the whole page.
(12.09.2007, 18:38)

Oliver Troch:-
Hello,
is somebody able to show me how i build it into my typo3 site??
Best Regards
(13.09.2007, 10:34)

Bruce:-
Stu, totally agree. Much prefer Opera's method. And once we're able to scale images too, we'll be able to provide something akin to getting out the magnifying glass to read the morning paper!
(13.09.2007, 22:56)

Stu:-
Bruce, now of course IE7 also allows us to use Ctrl+ and Ctrl- to increase/decrease the size of the whole page.
(14.09.2007, 12:22)

kenida:-
Nice work ; thanks

I have a little problem with menus in ie7 when someone resize the page then menu item's places changes in the layout. For example think that i have 5 menu items and they seem like below(when ie7 is maximized):
a b c d e

when i resize they seem like below
a b c
d e

I do not like that.Even if window is resized menu items should be at the same line. Could anyone help me with that fact?

Thanks.
(24.09.2007, 09:07)

Stu:-
kenida, there is no problem with IE7 and text size. However Firefox has a bug that causes the dropline links to wrap onto a newline when the text size is increased. Refreshing the page corrects this.
(24.09.2007, 13:15)

Jen:-
Hi Stu, love your work. I'm attempting to blend this menu with your validating drop down menu v.3, and it works in all browsers except IE6. I think I might have messed something up, but I'm not sure. The problem is, when I hover over one of the other menus it works fine, but when I roll off, the background from the menu seems to stay, blocking the text on the default menu, and some of the other menus as well. Any suggestions on where to look in the stylesheet? You can view the test I'm working with at www.jenniferdungan.com/test/menu/menu2.html
I'm also combining this with switchable stylesheets, I've been playing with the news2.css file and the two ie6 override files.
(26.09.2007, 19:08)

Paul Danciu:-
Stu,

Thanks you for sharing your work!

On Firefox 2.0 and IE7 the menu doesn't work perfect: the tables have to be set cellpadding="0" cellspacing="0" in order for the button images to be aligned with the container.

A second glitch, or maybe not: it seems I need some additional javascript to dynamically change the class of the current item to "current" instead of "select", in order to obtain the current tab selected.

Thank you again.
Paul
(20.10.2007, 00:51)

Ben:-
I'm having the same issue as Paul Danciu (below). I don't see how the class can change from 'select' to 'current'. I see no javascript or anything so how is this done?

Any ideas anyone?
(01.11.2007, 16:48)

Ben:-
fyi - the [if ie] info for each of the drop line sub sections is required to make your page XHTML Strict valid, even if you don't need it for IE itself.
(01.11.2007, 17:31)

Stu:-
Ben, I assume that when you click on a link it will take you to another page which can then have the 'current' class in the correct place. If you wish this to be 'automatic' then you will need to use PHP to add this style.
(01.11.2007, 17:31)

Brosia:-
I know this is going to seem stupid but I haven't been able to center this properly. So how do I center this menu?
(02.11.2007, 02:10)

Ben:-
OK, I got you. I assumed it updated itself.

I've just finished amending this menu so it uses just images and no text. I'll post a link up once the client site is done. Looks pretty good! :)

Let me know if you'd like a sneaky preview.
(02.11.2007, 16:51)

Tad:-
Stu,

Great menus including these ones. Why do you add three line breaks after the menus instead of forcing .nav height to say 65px?
(04.11.2007, 20:09)

Stu:-
Tad, if I did that then someone would copy my style and wonder why the had a gap after the menu :)
(04.11.2007, 21:21)

Bri:-
Does anyone know how to modify the dropdown to display links in columns rather than all in a row?
(05.11.2007, 19:28)

Stu:-
Bri, you just need to look at other menus on CSS play. www.cssplay.co.uk/menus/pro_drop3.html for instance.
(05.11.2007, 19:51)

Thanadon:-
Hi, I would like to know how to make this menu work with 100% width in IE
(28.11.2007, 11:15)

Gordy:-
Hi Stu I am very new at this. I downloaded and cut and pasted your menu (which are fablulous) into my " Microsoft Front Page" html and the result was as if had cut and pasted "Normal text" when I previewed it in the browser. Am I missing something please. cheers Gordy
(30.11.2007, 20:10)

Poz:-
Hi Sir, I'm currently testing this and all seems OK with menu and navigation. I'm using Frontpage2003 & IE7. The site also works when uploaded on my laptop, but FF seems to ignore the CSS and just displays menu text and looks terrible. I choose this navigation to test with my web following a painful experience with a sexy Flash navi, and you claim that this does work with FF. PS: I am more than willing to donate too, just want to get this menu doing what it says on the tin. Your help is much appreciated Stu - thanks.
(18.12.2007, 17:34)

Stu:-
Poz, can you email me stu{at}cssplay.co.uk with a url of your test page so that I can see where you may have gone wrong.
You can see from the demo on CSS play that this does work in Fx as well as IE6, IE7, Opera, Safari etc.
(18.12.2007, 17:43)

Poz:-
Thanks for your fast response Stu! My site is aquassist.co.uk and my sytlesheet is aquaNAV.css . I'm new to this so it's probably something that I've messed up. I changed the 'look' of your navigation bar, but only in terms of height, overall width now 678px and height 50px. I can't wait to see if you can help me get this looking as good in FF and I believe EX6 screws it up also. Thanks in advance Stu.
(19.12.2007, 13:59)

Arkady:-
Hellow! I admired of your sense of artistic taste and liberality and munificence. And let me put a questtion: is it possible to hide the content of CSS menus to a separate file in order while editing the content of menu one should not make corrections in every html page.
(08.03.2008, 06:02)

Bill:-
Pro Dropline menu = Brilliant.
How would I change the CSS to allow clicking on the menu rather than hover.
(26.03.2008, 15:14)

devon:-
Hey man.
Wicked script. Just wondering how I would go about changing this so that when I click on a link, the class of the link changes so that, THAT particular link is "selected".
Thanks in advance man.
(31.03.2008, 17:22)

devon:-
Hey stu
Please ignore my last comment there. Apparently my brain was off. I had the menu in an iframe that all my pages linked to, so it could be quickly edited if need be, but I just stuck the menu in each page and changed the class in that particular page.
Anyway, I'm not sure if this has been answered, I don't think so, but when I am currently in a menu (say, "About" with a submenu of "What We Do") and the "About" is 'current' and the "What We Do" div is 'select_sub show' and the "What We Do" link is 'sub_show', it works fine, but when I mouseover another heading with a submenu, the original "About" submenu stays visible and overlaps the new one. I am using transparent pngs for the backgrounds as well. Could that have something to do with it?
(02.04.2008, 19:55)

Paishin:-
Hello Stu,
great menu and very stylish.
I tried to add this menu to one of my pages but it doesn't work properly in ie6 (ie7 and firefox work fine). In ie6 sub menus (<li>) stack on top of each other at the left side of the page.
Any sugestions how to solve this?
(04.04.2008, 15:43)

Chris:-
Hi Stu,

I like to use this menu on my client's website. However I like to know if you can also send me the php file that dynamically change the class of the item from "select" to "current". Something what you have done here www.cssplay.co.uk/menus/simple_dropline.html

We are definitely considering a donation once we have the menu implemented on the site.

Thanks,
Chris
(30.06.2008, 19:34)

Jay:-
Hi Stu,

I have tried your menu by incorporating it with ASP.NET. However, when a 2nd level menu is selected, neither the 1st level nor 2nd level menu show as selected. The 2nd level menus actually disappear as soon as the mouse is moved elsewhere. Can you please advise? If I get it working, I'll be more than happy to donate!

Thank you,
Jay
(19.11.2008, 02:58)

Susan:-
Hi Stu
I plan on using this nav on a site I'm launching soon, however the issue about the main nav line wrapping in FF is still an issue (not fixed as per your note on menu's page). Although I did alter the styling of the menu to suit my site, I've run a line by line comparison between the FF "fixed" version you posted and my styled version and can see no extra lines that would account for a FF fix. URL to site I'm working on: www.prosperityhomesrentals.ca
(04.01.2010, 22:52)



Post

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://'

Support CSSPLAY

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.


CUSTOM SEARCH

Facebook Twitter rss feed Facebook Fan Page