Mobile Friendly Website


Doing it with style

Snazzy Menu 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

Rich A:-
Awesome site! I used this code as a base to create a horizontal sub menu. I simply added a table to the end (but still within) the <li> tag. The effect I'm looking for works perfectly in the latest FF/mozilla. However, in IE, the main menu items move when the sub menu item next to it are displayed. (Please see Can you help sort out the issue?
(01.05.2005, 23:24)

Rich A, just add table {position:absolute;}
to your CSS.
(09.05.2005, 15:11)

Hey Stu,

Once again, incredible site... I am trying to move up the text on the tabs so that they are a little higher than center vertically. How/where would I do this?

Also and probably even more of an issue is how would I get these tabs to be centered between two points? I have a 3 column layout, with the center column being dynamic in width and I would like the tabs to stay centered with that column even if the window is resized. Is that possible?
(08.06.2005, 22:13)

goJunior8, to move the text up or down change the line-height of the text span. To center the menu enclose it in a div which has a width value equal to the width of the menu and then center that div.
(09.06.2005, 07:25)

OR you could give the #info ul a width equal to the menu width and center the #info ul.
(09.06.2005, 07:30)

love it
(11.06.2005, 07:26)

The snazzy border menu works great on Safari 1.3 on OSX
(08.07.2005, 11:02)

Stu, thanks so much for sharing all this. I have a follow up of sorts to goJunior8's question. I have placed the snazzy menu in a div that is "position:absolute top:0; width:100%; height:50px". I was trying to get the menu centered (left/right) in the div and stuck to the bottom of it (something akin to what a "position: bottom center" would do were that available). As I said, I WAS trying ... I could get the tabs down there but they'd float off the bottom as soon as the text was resized. It seems that it would be easy to just absolutely position the menu with bottom:0 but then it appears using auto for the left/right margins won't center it. I finally flipped the tabs vertically and stuck them to the top of the div. Not what I wanted, but okay for now. Any suggestions?
(09.07.2005, 17:29)

Stu, your tabs work very well, a great solution to a table layout. I am curious if you have an idea for multi-row tabs. For example, when displaying 10 tabs, they wrap onto 2 lines, creating empty space on the bottom-right, which makes the content underneeth look unattached. Possibly having the second-row tabs stretch to fill the remaining space?
(15.07.2005, 17:26)

Stu, this is a fantastic site! Thanks for sharing all this fantastic CSS, I hope this site grows and grows!
(28.10.2005, 11:15)

10 of 44 comments (part 3). [ « ] [ » ] [ * ]


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