Mobile Friendly Website

CSSPLAY

Doing it with style

Six level centered 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

Christophe:-
does not work in FF 2
(30.04.2007, 15:24)

Christophe:-
weird sorry for my last comment - after 3 or 5 refresh of the page it is working properly
(30.04.2007, 15:25)

Johnny:-
Hey Stu,

Thanks for the help. It looks like there is a bug in Firefox 2.0.0.3 (Works great in IE6).
(30.04.2007, 17:49)

Johnny:-
Sorry, let me be more descriptive =)

In Firefox, the first time the centered menu loads, its "pushed together" and doesn't look right. If you simply refresh the page, it looks correct.

Any ideas on how to fix?

Thanks!
(30.04.2007, 18:44)

Stu:-
Johnny, I think that's fixed it.
(30.04.2007, 19:06)

Johnny:-
Stu,

Unfortunately its still happening. It can be tricky to replicate, so I would recommend clearing cache to see the problem occur.

I've been playing with it for a few hours and I'm still going to keep trying.. I noticed if I remove a few other #css-entries then it works, but I still can't isolate it.

I'll check back and see if you happened to fix it in a few =)
(30.04.2007, 21:50)

Stu:-
I have cleared my cache and it now works ok every time for me (FF 2.0.0.3 Windows XP)
(30.04.2007, 22:07)

Johnny:-
Hey Stu,

Maybe its me! When using your CSS code, in addition to the following CSS, why am I having such difficulty? A couple items are bunched together...

#footer {
clear: both;
margin: 0 auto 0 auto;
width: 995px;
text-align: center;
padding: 3px;
border-top: 2px solid black;
border-bottom: 2px solid black;
background-color: #ffcc00;
color: #000;

}

#search_header {
padding: auto;
margin: 0 auto 0 auto;
color: #000;
text-align: center;
border-bottom: 2px solid black;
width: 995px;
}


#search_header-barelysee {
color: #AAAAAA;
}
(30.04.2007, 22:36)

Stu:-
Difficult to say without seeing the page on site.
(01.05.2007, 12:12)

Roy:-
What Johnny describes is actually the same problem that I have. I tried to different computers (both the latest version of Firefox), and it didn't work.
(01.05.2007, 15:37)

Stu:-
Since the second style change I have had no problems with this in FF. I have tried two PCs XP and Vista and both have the same result, showing all the top level links in line.
(01.05.2007, 17:56)

Stu:-
Having tried many times to duplicate this error, I have found that it happens for no apparent reason. I think that this is a FF rendering bug. This is the only browser to do this.
(01.05.2007, 22:30)

John:-
Nice approach Stu, thanks for all the good work!
(29.05.2007, 14:20)

Daniel:-
I am extremely impressed by this dropdown. I have replaced my old javascript dropdown with this one. Everything works great in IE6 and Firefox. But the dropdown does not drop-down in IE7. I even copied the source output from your page as a test and still could not get the menu to drop-down. Is there something else being set in one of your other css stylesheets that are called at the top of the page that would be causing this page to function properly in IE7? All I am using is the source code available on this page.
(29.05.2007, 14:45)

Stu:-
Daniel, check that you are using a standards compliant doctype as specified by w3.org. See the FAQs for a link to their list of suitable doctypes.
(29.05.2007, 20:23)

Daniel:-
Stu,
You were right. I added the doctype and it functions properly in IE7. A new issue I discovered is in IE6, the css drop-downs do not appear over a non-css list drop-down within the page. The non-css list drop-down appears on top of the css drop-downs including the css main menu. This is not an issue in IE7 or Firefox. Also, I will not be able to convert the non-css list drop-down to css. Any ideas?
(04.06.2007, 16:10)

Stu:-
Daniel, give the menu containing divs a position:relative; and then apply a higher z-index to the menu you wish to be on top.
(04.06.2007, 20:38)

Felix:-
Hi Stu,

Is it possible to make this a flexible width top level list that expands to fit the text like in your menu #1 on this page
www.cssplay.co.uk/menus/drop_examples.html
I have tried doing this by not assigning a width to #pmenu a, #pmenu a:visited but it falls apart in IE 5.5 and 6, the rest of the browsers are fine.

Many thanks for evrything you do.
(17.07.2007, 19:02)

Steven Butler:-
RE: The six level drop-down menu with overlap and overrun - centered
29th April 2007

Works great in IE6, FF, Safari as is. However, when I export the CSS to a linked external stylesheet, the menu renders/reverts to the IE table version. That is the only difference in the two HTML files ... one has the CSS embedded and one has the CSS linked as an external stylesheet. Any thougts?

Does it have anything to do with where the following code (from the bottom of your CSS) resides? :

<!--[if IE]>
<style type="text/css">
#nav ul {display:inline-block;}
#nav ul {display:inline;}
#nav ul li {float:left;}
#nav {text-align:center;}
</style>
<![endif]-->

Thanks. Your work is awesome and I see your name and links everywhere on the other CSS gurus sites.
(09.08.2007, 06:02)

Corey Liebig:-
i love this site and have seen many of your menus being used. I've adapted this menu to a site I am developing and I really need your help. I am having trouble with just one or two pixels on the drop downs not lining up the same in FF and IE. could you please look at www.coreythomaslive.com/rwb_2 and direct me to what to do to get the pixels all flush with the drop downs?
designer@coreythomaslive.com
(18.02.2008, 23:40)

Ed:-
Stu-
I love this drop down menu and it works great in all the browsers I've checked it in; IE6, Firefox, Safari, Opera, and Netscape.
However I found something really strange in IE7.
If you scroll all the way to the last menu in a drop down, then go back to the top level of that list I get this (see image at the following link);

hawkdawg.com/CSSPlay.jpg

I even managed to modify it for a double level.

hawkdawg.com/CSSPlay2.jpg

Great coding. Thank you for your fantastic work.
(04.03.2008, 16:48)

Ed:-
Well, since you deleted my post I guess I don't have to worry about donating to you now.
(04.03.2008, 20:47)

Ed:-
Oops! Never mind. My post wasn't there a minute ago.
Sorry! :-)
(04.03.2008, 20:48)

Stu:-
Ed, both your posts are still in place?
(04.03.2008, 20:49)

Ed:-
Stu -
Again I apologize. I don't know why I didn't see my post before.
Please delete the redundant posts.

Any ideas why I see that in IE7?
(04.03.2008, 20:53)

Stu:-
Ed, this is something I will need to look into. I thought that I had checked all my demos in IE7 but I may have missed this one.
(04.03.2008, 20:59)

Ed:-
I don't use IE7 as my default browser anyway so it's no big deal to me. I use FF 2.0.0.12 and it works fine in it.
Just thought I'd point it out.

BTW! I just donated a little bit to you. :-)
(04.03.2008, 21:12)

Ed:-
Hey Stu,
Just wondering if you have had a chance to check into the IE7 issue I mentioned in my post on 04.03.2008?
(21.04.2008, 12:56)

Olga:-
Hi Stu,

I've had an issue centering the menu in IE (I've only checked it with version 7). No matter what I do, it just won't budge.

Here's a link to the trial page: www.olgabas.com/index_try6.html

Any and all help would be much appreciated.
(06.12.2008, 16:36)



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