Mobile Friendly Website


Doing it with style


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

Stu, I love the new design, I'm glad you went back to the alternating nav colors. Overall I think this design is easier to read, although the font is bit small, maybe by a few %'s or 10th's of EM's. I see you've dropped the 90% in the #wrapper but kept the 76% in the body and now use a p selector to control font size, which you might have done in your previous, I just havn't taken a look under the hood in a few designs. I think your previous font size was just right. I'm also glad you droppped your justified column text.

Well that's all, hope I didn't nit pick too much ;o)
(18.07.2006, 21:45)

yeaaaaaah I'm the firts to post a comment since the new update !!!
(18.07.2006, 21:46)

Seriously : I liked the screenshot popup on links on the previous version... you should have let it in this new (and nice looking) version
(18.07.2006, 21:47)

Oh, I forgot to ask, why did you choose to make some users have to scroll to see the newest experiments on the homepage? Another thing I like with the new visual design is the light tan bg choice for your content box's, it's very nice, much easier on the eyes than the previous light blue.
(18.07.2006, 21:51)

Thanks for your comments. The text size has dropped slightly but once you get used to it you should find it ok. I did experiment with this and found that after a while I preferred it.
The scroll to see the latest pages was deliberate so that you view the whole page ;)
The screenshot pop-ups I found to be annoying after a while as they popped up when you didn't want them and they went off screen etc. etc. So I have replaced them with descriptive text.
I have also added a P3P compliant privacy policy (let me know if it causes any problems).
Oh..and the home page ads will be dropped at the end of August (well almost).
(18.07.2006, 22:33)

jansie blom:-
hi. i need some help please, anyone. i started web building this year, and love css. in a four page website, how can i reduce the number of pages from 4 to only one? in other words, use a box which stays the same throughout, and make only the content change, but with a navigation to make it look like you're actually going from one page to another? my e-mail address is
(19.07.2006, 10:26)

jansie blom, you could use something like this:
(19.07.2006, 10:36)

I love you Stu, even if I'm straight :)
(20.07.2006, 16:17)

Hi Stu, I just discovered your site through Great site! I'm a newbie to CSS but have dabbled in it a little with my blogger blog template. I am attempting to create a website for my new side business, and am using a free table-based template I discovered on the web. Do you have any advice on how to recreate this with CSS? I can figure out how to edit something already in place, but have no clue on how to create from scratch.
(20.07.2006, 21:10)

Ashutosh Bijoor:-
Love the new design! Thanks for sharing a bit about you as a person too. Gives your work a new dimension.
Thanks for sharing all your CSS work.
(21.07.2006, 05:04)

Jason, leave it with me for a while.
(21.07.2006, 07:46)

Hi Stu
As I'm starting a new business I'd like to hire you for free. you will design our website. If you could design it, develop it, host it, take pictures for it, it could be great. Of course I won't pay you a penny and you won't have any %age in the company..
Hope to hear from you ASAP.

ahahahaha hhahahah ahhahaha hhahahahah ahahaha
OK I stop joking in your comments ;)
(21.07.2006, 16:39)

Jason, just this once I have converted most of your tables layout to css just to show what a difference there is and how simple it becomes.
If you want it just copy the source code and new images.
(21.07.2006, 21:03)

Wow Stu, that is awesome. I can't thank you enough. This definitley helps out, and is a great starting point. My goal with the CSS would be to eliminate a lot of the images, because I am assuming that many of my potential customers will still be on dialup. I'm in a rural area where highspeed is still, sadly, rare. So I am going to play with this and see what I can do. I'd also love to implement one of your dropdown menus and replace what is currently there. I also want to use one of your multi-page photo galleries on my sample page. If all goes well, I'll be sure to link back and donate. Thanks again!
(21.07.2006, 21:53)

Jim Fruth:-
I've been doing websites for years, and finally decided I needed to throw out the tables and get fully into CSS. Your site is an inspiration. Thanks for sharing your work.

Smiling now in Dallas, TX.
(23.07.2006, 01:18)

Hey STU, you are a holly person... I just discovered your page, this will be the page which i visit most. Thanks for helping and being inspiration... Is there any book written by you? If there is i'll love to have one...
(23.07.2006, 11:56)

sorry, i forgot to write my name..
Amsterdam/The Netherlands
(23.07.2006, 11:57)

Ayhan, no book yet, although I did write two on machine code programming back in the 1980s, but not much good now :)
(23.07.2006, 15:50)

Hey Stu, I'm putting together a layout( using a combination of a few elements from your awesome site. An adaptation with the partial opacity tutorial and the fixed positioning(IE) tutorial to create a see through effect. Almost everything is going fine except for a few issues. One is with the scrollbars in IE. They're getting overlayed by the fixed divs, and also the main bordered window recognizes a link underneath it in IE which is clickable, but not in Firefox or NN. They don't even respond at all to the link. Would you be able to give any assistance on this at all? I also wanted to ask you if you knew of a way to make the main bordered window stay centered in the browser window at all times, very much like you did for Fixed Layout #2, although keeping the scrollbars on the browser window and not the divs. Mostly so that content can still be seen scrolling underneath the opacity areas. Thanks again Stu for any assistance that you might be able to give me. Awesome site with tooooooooonns of knowledge!
(23.07.2006, 22:29)

Al Toman:-
I don't know Mr. Nichols!?!?!

You look toooo awfully comfortable in that lounge chair!!!

Auh heck. You deserve it!

Lookin' good,
Al Toman
(24.07.2006, 01:17)

All, I am getting more and more spam with this comments system.
Can anyone recommend a similar system with an anti-spam method such as a code to enter or a sign-up or even an admin intervention before printing.
Failing this I may have to think about hacking this script some more.

(25.07.2006, 22:25)

All, I have had to add an anti-spam feature to the comments. Sorry for the inconvenience, but all you need to do is enter my first name (just the first three characters - upper or lower case) in the extra box. Hopefully this will stop the robot spam that has been filling the comments over the past few days (I had to delete over 200 entries).
(26.07.2006, 23:19)

This site is amazing. I'm studying HTML for the first time, and this site blows me away every time. Thanks for all the work, but I'm also interested in using sound files with web pages. I hope to see that here also one day. Thanks again
(28.07.2006, 00:10)

Hey Stu: I came across this site that referred to a IE7 compliance patch that is all javascript. IE7 is just the name they gave this and not the actual browser itself. This patch is a .js file that you can have loaded on your site so that IE 5+ becomes very CSS standard compliant and one doesn't have to do nooooooo where near as many hacks due to the issues in IE. I feel you have a very good take on CSS (obviously with your tutorials and all), and wanted to know what you think about this .js patch if you've heard of it, or anyone for that matter. This is the site if you don't have it.
(01.08.2006, 12:07)

Garlon, this IE7 has been around for a long time and if you don't mind javascript then it does the job it says it does.
It makes use of IE behaviors (another way of implementing javascript) and as such will not work on browsers that have javascript turned off.
CSSplay does not use javascript in any of its demonstrations and so will not be using this 'IE7' hack.
(01.08.2006, 12:18)

David Sanguinetti:-
Excellent website! Really useful!

Congratulations for your eforts!

David Sanguinetti
(02.08.2006, 21:35)

Stu: Great Site. I have been playing with the pure CSS dropdown menus, and have one functioning on the redesign of one of my sites(not really live yet, but a link will be on the site for sure, already in the comments.)

The site is - I thought you may be interested, since I reworked the colors and added a bottom border to the menu that changes color with the dropdowns. Fairly slight modifications.

The main reason for posting though, is that the menu does not work well in my installation of IE7 Beta2 - now that could be due to it not truely being installed (I use a script to load it and clean up after it is unloaded) but I wanted to let you know that and find out if you have had any other feedback regarding the dropdown menus and IE7.
(03.08.2006, 05:24)

Mike, I have not bothered too much with IE7 beta versions as these are still in the 'testing' process and as such may not work in the same way as the final product.
However, I have had feedback that says 'most' of my drop-down menu versions will work in IE7 beta.
Once IE7 final is released then I will upgrade one of my PCs and test each menu for compatibility.
(03.08.2006, 13:01)

I am now a bit more like the cartoon character on the home page. I am sat here with a brand new laptop on my knee, with a WiFi connection (and bluetooth) surfing the internet.....brilliant!
(04.08.2006, 21:31)

thanks for all your work Stu, you've brought an old perl script html layout out of the ice ages

WebAPP Network
(05.08.2006, 20:41)

Your work is so wonderful and thank you for sharing!
(09.08.2006, 18:29)

Stu - what can I say? The site's simply amazing.

Question: I seem to recall running across a remote image rollover here at one time and just can't find it now to save my life. I.e. you hover over a link and an image other than the link itself changes.

Am I crazy or could someone please point me to this?
Thanks and keep up the wonderful work!
(09.08.2006, 23:12)

Nora, there are many examples that use this principle. has an image change on the last list item. uses a mouse click but would work with :hover instead.
(09.08.2006, 23:24)

Every time I get hung up on anything CSS related, I reference directly to your site. Just wanted to thank you. CSS is a powerful tool, and you definitely unleash that power with your wonderful tutorials. Thanks again!
(10.08.2006, 16:23)

Dear Stu,you pages are my most famous, I really like it. I´m from Europe-Czech Republic...It is inspirations.
(11.08.2006, 01:17)

Stu: Thank you for your website. As a fairly recent convert to CSS, I am completely obsessed with using as much CSS as possible.

Currently I am working on an interactive area map in Flash for one of my clients. Basically, you click on a heading such as "restaurants" and the names of the restaurants, as well as their location on the map come up.

My wheels have been turning as to a way to do this with CSS...what are your thoughts? I think it is very possible using similar concepts to image maps/clickable photo galleries.

Any thoughts on this?

(11.08.2006, 18:02)

bridget, this is always possible in css, although there will be some limitations on functionality. For instance if you want to click on a heading then the 'pop-up ' names and locations cannot also be clickable. You could use a hover on the headings which will then allow a click on the 'pop-ups' but this is not so user friendly as the first hover can be a little annoying.
But on the whole it is possible with css.
(11.08.2006, 18:39)

Charles Goodwin:-
Hi Stu,

I love what you have done with CSS.
So much so I've incorporated some of your ideas into my new web site at

As you can see, I've incorporated the fixed header and footer with drop down menus.

It's not so easy combining them as some of the fixed header and footer layouts require IE to work in quirks mode but the drop down menus don't need quirks mode.

I was happy with the results until I discovered things going wrong when I try to use bookmarks within the main content (eg
The header obscures the first few lines.
So what to do?
Is there a different cross browser fixed header/footer layout that I should use?
(12.08.2006, 22:11)

Hi Stu
Many thanks for sharing your CSS know-how - I didn't realise that it was this powerful.
Removed nearly all Flash and replaced with CSS.

(13.08.2006, 17:11)

Thanks, as always, Stu.
By the way, I'm looking for the link to the chap's site that you got your little menu images from, but I can't find it! Could you direct me to it again?
(15.08.2006, 07:05)

(15.08.2006, 10:23)

Question: How can you make a menu like yours on this site, that changes to show what page you're currently on?

Is it easy to do without a CMS and do you have to mess around with PHP?
(15.08.2006, 16:58)

Kurt, this one is produced with a php include but only because it saves me having to hard code it on each page.
(15.08.2006, 17:28)

Lynn Wright:-

First and foremost, thanks for providing so many great examples. They have been the foundation of my efforts to learn effective and attractive HTML and CSS.

Now for the problem. I am trying to develop an extensive hypertext document for use primarily offline, although distribution on the web isn't out of the question. Your page at:
seems to be the type of home page I would like to mimic, so I downloaded the source code to give me a starting point. Problem. It works as I would expect with both IE and Firefox when viewed on the web, but when the downloaded file is viewed by IE 6.0 the footer doesn't stay at the bottom when scrolling the content area.

If you have a chance to reply my address is:
If not, I have already had a fortune's worth of free help from your web sites, and I thank you again for that.

(16.08.2006, 15:09)

Lynn, you have probably deleted the top line which switches IE6 into quirks mode.
(16.08.2006, 16:10)

Lynn Wright:-

Somehow the quirks mode line got moved down a few lines. Now it works!

Thanks for the reply.

(16.08.2006, 20:05)

Hey Stu, I'm wanting to incorporate a comments section on my site very similar to yours. I see this page is php correct? Did you use something similar to a blog software and then just change the template to match your site? I also wanted to ask how you put that name validation field in as well. I installed WordPress because my hoster had it already as an application I could use, but I didn't see where I could add a field like the one you did through it's control panel. I'd like to use WordPress if that's what I need seeing how it looks fairly simple, although I just don't want the spam, nor do I want the extra links on the side and the standard header that comes at the top of the default theme.
(18.08.2006, 19:22)

Dear Stu
this is really a helpfull page, the best considering css-examples and solutions. What makes it so unique is not the only the amount of samples, its your really good navigation and construction, it easy to find what you are looking for. Perfect :-)

Janek (sorry for the german english)
(19.08.2006, 11:32)

Happy Birthday
(20.08.2006, 06:47)

momotaro, cheers. I am now an O.A.P. free bus pass, cheap chips, etc. etc.
(20.08.2006, 09:33)


I just stumbled on this website while doing a research on css menu tutorial. I am really impressed with a lot of demonstrations that display the potential of CSS. I am currently developping a web site for a friend. The only browser that did not render properly was Internet Explorer 6. As a consequence, I currently tune my css skill inspired by your demos.

Now, while working on Active Display Gallery, I notice a problem with the right absolute position using Web Developer from Firebox. It display the horizontal scrollbar thus I currently change to left position. I am sure if this issue is know but you can test it with any browser of confirm.

Thank you for this excellent CSS source. It looks like a real treasure.
(25.08.2006, 07:20)

Frank Mack:-
I am tring to use the code on but my 5th box keeps blowing up and the text does not seem to be getting the formatting from the css. It seems like the page is not seeing the css file. Could you have a look and tell me what I am doing wrong?
Thank in advance,
Frank Mack
(27.08.2006, 21:57)

Your website is awesome!!! Never seen so many samples together!
Bookmarked it!!!!!
(28.08.2006, 14:32)

Frank, it looks ok to me. All that is wrong is the 'Renegade Lights' overflows onto two lines and creates a gap un the balloon.
(29.08.2006, 13:34)

Stu, I recall a recipe card cascade where if you hovered a card it popped up from within the cascade.

I recently had a hd failure so lost all my css expirements and collections.

I could have possibly found this recipe thing somewhere else but I'm pretty sure it's you who created it. This was years ago I found it, maybe as far back as 2004.

Was wondering if you had any old gems like this lying around your hd that you could possibly be resurrected.
(30.08.2006, 00:12)

Tim, I think you want this
(30.08.2006, 12:59)

Hey Stu, just wanted to leave a comment on your site. The coding is beautiful. I am also an aspiring web designer and at only the age of 18. I already know quite a bit about xhtml/css as well as MySQL/PHP and how much easier it makes life :P

I also wanted to comment on your colour selections on the site. Colour selections are always the hardest thing for me to choose. I sometimes spend hours just dabbling with different shades of the same colour. Anyways, I might end up using some of the colours you have selected if that is ok :)
(30.08.2006, 20:35)

Hi Gene, the colors are free, help yourself, and good luck for the future. Let's see what the web is like when you are 60 ;o)
(30.08.2006, 20:54)

stu, thank you so much! your photo galery (the one with the thumbnails) was just what i was looking for! my boss wanted a galery like that for a project and i didn't know how to do it without java script (i don't know much java-script, actually). but with your tutorial being so easy-to-follow it was no problem!
thanks again! i will place a link to your site in the imprint.

greetings from berlin /germany!

(31.08.2006, 15:21)

Hello again Stu! Just commenting to let you know I linked you off of my site ( There you can see of my handy work. Only been doing Web Design for about a year :)

ps, thanks for the colours :)
(31.08.2006, 21:20)

Wow, Stu, you continue to amaze me.

I'm now learning z80 assembly, and I find it quite hard. And them I came to your site and read that you made two books about it. That can't have been easy. Understanding Z80 assembly is difficult, but making others understand it is even more.
(01.09.2006, 17:53)

James Peter:-
In English:
Many of these examples don't work when the document is sent like aplication/xml. It would be important to take into account these three documents at the time of making an example with CSS.
I'm sorry for my English, but I'm learning :P

In Spanish:
Muchos de estos ejemplos no funcionan cuando el documento es enviado como aplication/xml.
Sería importante tomar en cuenta estos tres documentos a la hora de hacer un ejemplo con CSS:
text/html, aplication/xml, aplication/xhtml+xml

Saludos Stu.
(03.09.2006, 16:05)

James, most, if not all of these demonstrations DO work when sent as application/xhtml+xml as this was the method I did use until a couple of months ago. I did have this site as xhtml1.1 and used .htaccess and mod rewrite to change the MIME type.
But have now changed to xhtml1.0 strict to make it correct in IE.
(03.09.2006, 16:50)

Hi Stu,
I was wondering, I have downloaded Alex's comment script and its working great allthough yours looks really great, how did you style yours because I would like to do something simular to mine. I specially like the biege background on the posted comment area :)
(04.09.2006, 02:45)

... have you run across anyway to specify the color of particular characters? In my case, I want to make the color of my punctuation different from the color of my text without having to individually code each instance of a period, each comma, etc.
(04.09.2006, 09:53)

Kevin, mine is an older version that I have modified considerably to add anti-spam features and new layout. It is now so different and hard coded for CSSplay that it would not be exportable to any other web site.
(04.09.2006, 14:02)

Sam, I cannot think of any way to do this with css. But there may be a way with javascript.
(04.09.2006, 14:03)

Stu, what happend to that green and white layout where if you clicked a section link the section poped up in the content as if it were dynamically place there. I think what you had done was made a page of content with anchors for each heading then put big top margins for each section so that when you clicked a section link it would appear only in the fixed height of the container when it was really just scrolling down the page to see new content.

Sorry for the run-ons.
(06.09.2006, 00:26)

Tim, I think you want this one which is part of this demo
(06.09.2006, 09:40)

Yup Stu, that would be the one, thanks. It's a brilliant alternative to hiding elements with javascript. Were you the first one to think of constraining the content to be hiden with internal links to pull up each section?
(07.09.2006, 01:47)

Tim, the first to do it with css I think.
(07.09.2006, 10:07)

I've noticed that when wanting to make an anchor's child display on hovering over the anchor in IE, it won't work unless there is some style, such as visibility:visible, given to the a:hover. I.e.:

a#item:hover span {display:inline;} will not work unless a#item:hover has some style given to it.

I've only noticed this a couple of times and wonder if in your experience you always need to "trigger" this sort of behaviour with IE by giving the a:hover some style.



P.S.: Sam, you can do that quite easily using a scripting language such as PHP.
(12.09.2006, 06:20)

Rafael, this is a well documented bug in IE5.x and IE6 (cured in IE7) where to trigger a :hover event such as displaying a previously hidden span you need to 'change something' in the a:hover style before you style the a:hover span.
This has cropped up so many times in the last few months that I am thinking of writing a short tutorial to explain this bug.
(12.09.2006, 15:56)

Very interesting site with a lot of cool ideas... too bad my small mind isnt able to translate most of it to what I need (ha, yea new to css, how did you guess)... All I am trying to do is make a simple menu bar that will 'float' with the page as it is stretched... and the menu is fairly simple too, just a classic background color swap on hover... but I just cant seem to find the right combination to get it to work... any suggested resurces or links I should try? Thanks!
(12.09.2006, 20:49)

Hi fatmacman, do you have a url of what you are trying to do?
(12.09.2006, 20:52)

no, not yet, sorry... the best example I see on your site is C1sissy's menu - just the horizontal version - but I don't want it glued to the left - instead I would like it, and the body, to be centered on the page and to move (much like your page does) when the width of the page is adjusted... I know this is a bit much to ask, sorry.
(12.09.2006, 21:00)

fatmacman, there is a centered menu here but do you want this to be stretched full page width or do you have a fixed width page with a fixed width menu? You can email me stu{at} if you like (perhaps with an image of what you have in mind).
(12.09.2006, 21:08)

Thanks for the reply, Stu. Given the amount of traffic you get and people like me asking you the same questions, a tutorial on the subject would probably not go amiss!
(13.09.2006, 01:34)

Your website is very interesting. I love the style(s) very much too. Great ideas... Maybe it would be a good idea to make external sites appear in separate windows?
(13.09.2006, 14:32)

Guy, CSSplay is xhtml1.0 strict which does not allow 'target' so all links will take you off site as standard. However it is possible, using most browsers, to right click a link and select 'open in new window'.
(13.09.2006, 14:58)

Hi Stu,
I followed the instructions you gave on "How to Create a photographic gallery using css"
and ran into some problems when I tried to view the page with IE 5.2 for the Mac. Other friends have had problems with IE for the PC. What happens is that all the thumbs load, but full size image doesn't appear when you hover over the thumb. None the less it works great with Firefox, and Safari. Please help since there are many poeple who use Internet Explorer. I have the page temporarely at
(13.09.2006, 18:25)

Rebe, at the beginning of the article I state that this gallery will work in all the latest browsers and also IE5.5 (windows PC). Mac IE5.2 is an old browser and is not capable of understanding the style used. For every 50,000 visitors to this site only 2 use Mac IE5.
(13.09.2006, 18:51)


I was wondering if anybody knew of a bug regarding backgrounds not displaying in FF and Safari for Mac. Believe it or not, the page is displaying beautifully in IE on PC. The top backgrounds are displaying, just not the one through the body content. Any ideas or help would be wonderful, I have been banging my head with this all day.
(15.09.2006, 22:50)

Bridget, you can see the problem if you add border:5px solid #f00; to your #container style. IE will place the border around the whole of the lower section whereas FF etc will just show a 10px high line across the top. If you are having background problems then suspect that the containing div is not actually containing the content. In this case you are containing floats which IE handles incorrectly and will expand the container to fit. FF etc will not expand the container and the content will 'float' outside of it.
You will need to clear your floats to make the container contain them.
Before the closing container </div> add <br class="clear" />.
Then in your stylesheet add .clear {clear:both;}
(16.09.2006, 11:57)

Stu, I'm sure you know by know how great Textpattern is,
I just found this plugin that may do what you wanted for your comments sections <>

Any good? I havn't tried it out but seeing it has pagination of comments it might be what you need.

If you need any help with Textpattern let me know I'll be glad to help.
(19.09.2006, 02:03)

Thanks Tim. I did try Textpattern on an earlier website, but this one is all hand coded and I wouldn't want to use Textpattern just for comments.
I have been thinking of adding a forum though, but not sure how popular this would be or if I would have the time to moderate it.
CSSplay will probably move on to a new server soon so I may add this feature then.
(19.09.2006, 08:17)

A forum! That would be great, I can vouch for the <> forum, very easy to style & customize accordingly. I even got the forum to be fixed width which leads me to believe it could be integrated in to a sites layout.
(19.09.2006, 15:54)

Stu, I'm doing a menu site for a restaurant, I noticed /test on your site has something I like in particular. Is this something you are going to expand on? I'de like to know what you think the smartest idea for a menu (markup/css wise) would be. For instance for the menu I want to use tables cause they display easily, but I could just as well use lists. So I could go both ways, tables or lists.

One last question, if you were to code a food menu with css which examples/demo's of yours would to look to for inspiration?

Thank you for your time.
(20.09.2006, 01:28)

Regarding restaurant menus with CSS, I just found this example on, Stu you may want to take a look at this <>

I like how he used images for the separators. This is a very inspiring use of definition lists also.
(20.09.2006, 01:37)

When you roll over YOUR nav headers how do you get the color to disappear for each box?
(21.09.2006, 23:14)


ul#main_menu li a b {font-weight:normal; position:absolute; bottom:5px; left:5px;}
ul#main_menu li a.mm1 {background:#dfd7ca; border-top:10px solid #dfd7ca;}
ul#main_menu li a.mm2 {background:#b2ab9b; border-top:10px solid #b2ab9b;}
ul#main_menu li a.mm3 {background:#c9ba65; border-top:10px solid #c9ba65;}
ul#main_menu li a.mm4 {background:#e2dfa8; border-top:10px solid #e2dfa8;}
ul#main_menu li a.mm5 {background:#d4d8bd; border-top:10px solid #d4d8bd;}
ul#main_menu li a.mm6 {background:#949e7c; border-top:10px solid #949e7c;}
ul#main_menu li a.mm7 {background:#758279; border-top:10px solid #758279;}
ul#main_menu li a:hover {border-top:10px solid #fff; cursor:pointer;}
(22.09.2006, 01:20)

For the life of me I cannot figure out one of the lines of conditional comment you use to get the final version of the drop-down menus to work. How does the logic for the following line work?
<!--[if IE 7]><!--></a><!--<![endif]-->
(22.09.2006, 23:36)

By the way, my previous post under my name, Tim, is confusing, since there now appears to be two Tim's posting here. Perhaps I should go by the name, TimB. I will use that name in future posts.
(23.09.2006, 14:37)

Tim, for a full explanation see
This is my own version of IEs conditonal comments that allows you to target specific IE versions AND all other non-IE browsers. So this particular one will target IE7 AND all other non-IE browsers, IE versions IE6 and lower will not see the closing </a> tag.
(23.09.2006, 16:30)

If you can read this then you are getting CSSplay from the new server.
(24.09.2006, 20:13)

Very awesome work! Thanks a lot!
(26.09.2006, 00:33)

I love this site! Since I'm new to CSS, can anyone point me to where I can find information that helps me with the placement of multi-layer css menus? My question is do I place the XHTML of the menu on each page of my website? If not, what is the standard for how to place css menus? Many Thanks.
(26.09.2006, 07:32)

Hi Stu,
I'm using your Krazy Korners code on a site I'm producing.
The link is
The site looks as I want in Firefox, but not in IE.
The spacing between the divs using Krazy Korners is expanded in IE pushing some divs out of position.
I've scanned my css and can't find a margin entry that might be causing this.
Is this an IE quirk or do I need to edit some of the Krazy Korners code?
Thanks for your help.
(26.09.2006, 17:26)

Jon, this is normally caused by padding in <p> or <hv>. Change padding-top or bottom to 0 .
(26.09.2006, 17:48)

Hi there ;).

I never found a web site like that one, it's simply SUPER!.

Well organized, many script, examples, IDEAS, all free (almost all) user friendly layout, texts are simple and clear and all together is an amaizing web resource, I can only say BRAVO or better, BRAVISSIMO!!! :).

I will spread the word about your web site around ;).

You do really a nice job here ;).

I also started my IT career with ZX Spectrum 128, for that time it was a really nice machine ;).
(27.09.2006, 15:37)

Stu do you know a way of making a site resolution auto-adept?... The lay-out always changes when opened on differend computers and I don't like it :).
(28.09.2006, 13:54)

bart, only by having a fluid layout or using javascript to check the vistor's set up.
(28.09.2006, 14:27)

Bryan Z:-
Hi Stu . . .

I am trying out your "A Vertical Button Menu - The EASY Way" tutorial, and so far - so good. Does this method allow you to use submenus, and if so how is this accomplished in a horizontal situation?
(29.09.2006, 11:45)

Bryan Z, if there is no sub menu in the demo then it is not able to use this option. You should check out the menus that do allow sub-menus and adapt these instead.
(29.09.2006, 12:13)

Hi Stu, I have used your css drop down messages and image display examples at the redesigned site.
Thanks, I have learnt a lot about cascading style sheets and their facilities from your site.
(30.09.2006, 14:16)

Congratulations is an awsome work great site and well explain
(02.10.2006, 21:11)

I reached your site through w3c. I want to thank you, for it was not until today, that I actually think its possible for me to build a table-less design. I've been doing this for many years and can now see how beautifully it can be done thanks to you.

Here's my page concept (before): and the beginning of my new css page now: - As you can see I am stuck on 1)how to center the entire box, and how to build the middle, 3-col content area. But I will keep poking through your site to find the answer. Thanks again.
(05.10.2006, 21:03)

Mia, to center the layout in FF, Opera etc use
.xsnazzy {
background: transparent;
margin:0 auto;
To center in IE5.x and IE6 use
body {text-align:center;}
then use {float:left; to re-align the text.
(05.10.2006, 21:09)

I love your site! Thanks to it I started to experiment with CSS a bit more. I'm not perfectly happy with the results yet, but I'll manage.
A question: The first time I got here, there was a step-by-step tutorial about how to make a photopage, using dog's photos. I can't find it anymore. Maybe I'm not looking in the right place, but if it's still there, could you post the link for me here?

Thank you!
Jelga (
(07.10.2006, 17:41)


Every time I visit your site (which is often) I get lost looking at all the amazing twists and tricks. Wow.

A quick question. I have based my gallery on your multi-page photo gallery MK3, only I took out the multiple galleries on hover and it's just one unordered list - so loosely based on yours.

Question: in IE only, I ended up with the hover image hiding behind other list items but only those that follow it. In other words, it displays, but acts sort of as a background to everything after it. List items before it go behind this hover image as they should. (See problem here: - please note the page is still under construction but it's done enough to show the issue)

If you or someone else could take a look and see what might be the issue, I'd be very grateful because I have no vague idea.

Many thanks and keep up the excellent work.
(09.10.2006, 16:10)

Andy Bertaut:-
I love this site. love it love it love it. i want to be able to get this good with css. can you recommend (or write!!!) any book? I plan to eat every word up that you say on here, but i like to sit down with a hard copy and a cup of tea...
(12.10.2006, 13:12)

Hello, Stu. I just wanted to take a moment and let you know that I really love and respect your site. I am just a high school kid who is developing a keen interest for HTML and other simple programming languages. I came upon your site from the W3C and was just blown away! Everything here is amazing. I thought all of this kind of stuff, like drop-down menus, had to be done with flash or java. You are truly a very brilliant person and I hope you continue to work with CSS. I always come back for more, even thought I don't understand most of it... But just seeing what I could even begin to do is really inspiring. Anyway, thanks again and WOW!
(should you choose to reply (not that you need to))
(13.10.2006, 04:07)

Your site is, for me, epiphany. You have a beautiful site and incredible eye.
Thank you so much for the lessons.
You have inspired me.
(15.10.2006, 07:35)

Fabulous examples of how to produce framelike presentations. However, I cannot get the style out of the html and into a css file - the page nolonger works. A clever ruse to get me to ask permission I suspect. Well here I am asking permission - which you did request - to use your script on my site - I am refering to Layout 1 -
I hope that I may use this fabulous resource of yours. cheers,
(16.10.2006, 23:59)

dao, all of my layout example styles are free to use. You should be able to move the style to a separate file without any problems. There must be an error in your path to the css file or from the css file to any background images.
(17.10.2006, 10:09)

hey Stu,

I'm trying to create a vertical and horizontal centered layout that works in IE.

I use the following code to create a centered axis point:

#axis {


Around this axis I build a content block, using negative margins; so, for example, if I want a rectangular content block, I code it as:

#content {



In the body, I just code:
<div id="axis"><div id="content"></div></div>

From my tests all of this works fine in IE, etc. However, if I shrink my browser window size too much horizontally or vertically, I lose access to 75% of all my content.

My solution was to create an outer div and set the height and width to 100% with a min-height and min-width to the corresponding dimensions of the content block. Of course, this works in Firefox and safari; but, it did not work (of course) in IE.

I tested out your min-width and min-height solutions; but, they did not match up so well to my particular usage for min-width and min-height.

Cheers, Sam.
(17.10.2006, 17:20)

Roy Gentry:-
Thanks for your site it gave me the key elements to start including 'frames without frames' on my site. As ever the simple solutions are the best and I was struggling for a long time to get the concept working in both IE and other browsers. I have achieved this but am still struggling with formatting the main content using CSS without being able to use absolute and relative positioning. I can use tables but that rather defeats the object. Any ideas that I can work on? Not looking for CSS code but just some ideas that I can work on to move forward. Once again thanks for providing the 'snippets' I needed to develop my site.
(18.10.2006, 19:14)

Roy Gentry:-
Reference my previous comment.
I've worked it out - again simplicity is the keyword. Thanks again for your site and giving me the encouragement and indicators to try work arounds.
(19.10.2006, 10:56)


With 'Fixed' layout version 3' (Pollution), How could I get a a link from the left (smog, Acid Rain, Fumes, etc) to load INTO the scrolling window to the right? I used to do that with frames but this is obviously different.


(20.10.2006, 14:41)


You have left a rather large foot print in the CSS / Web Design realm. I wanted to let you know that your ideas have been very inspirational for me. Cheers to continued success and admiration.
(20.10.2006, 15:30)

David, CSS frames are not the same as framesets. It is not possible without using a programing language to do this with CSS
(20.10.2006, 15:31)

First let me say that I love your site and it has rekindled my love for HTML. Thank you so much... With that said I find myself having a problem with one of your codes
"A Scrolling Photograph Gallery"
as soon as I try to use the code in Firefox everything works great, but in IE when I place my mouse over the thumbnails the larger picture appears in the Thumbnail section rather then on top where intended. Refer to Screenshot (if needed)
and the code I used is @
Any help or suggestion is really appreciated, anyways if you get to this or not I just wanted to again thank you for pouring your knowledge into this site for the rest of us to use.

Thanks Again,
Mark C.
(23.10.2006, 02:22)

Mark, like I keep repeating all over the site, you must use a standards compliant doctype. Check halfway down the home page for a link to list of suitable doctypes.
(23.10.2006, 08:08)

just to tell that your website is a great ressource for web developers !
Thank you for your work, it helped me a lot :)

(23.10.2006, 10:56)

Can stylesheets be namespace qualified so that the cascading of styles does not affect an elements styling.. e.g.
<foo:div><div>some html</div></foo:div>

Here I would like foo:div to behave independent of the default namespace, provide a container, and not have the inner div inherit any style inherit style from foo:div.
(24.10.2006, 03:15)

Greetings to css Guru!
I fascinated by css capabilities. Still learning I looking forward to get next few things done on css.
1. Smoothness or sliding/fading boxes in and out.
Perhaps use flick animation of a background picture for fading element (menu)? Change color (opacity) of an element gradually as hover moves over it. That way, speed of “fading” would depend how fast a user moves a cursor! That is something scripts have not done yet!
2. Forms and dynamic content without using scripts or databases – that one would turn world upside down! Is it possible use only css form to create an html page (by using anonymous ftp perhaps)?

(24.10.2006, 04:37)

Excellent site - keep up the good work!
(24.10.2006, 16:09)

I did a great css tricks. Congratulations!!!
I have just one notice about the site - you reserved ALT+D for 'DEMOS' menu shortcut. But this is a common browser shortcut for accessing the address bar and it is quite annoying when you press ALT+D and see a new page loading instead of positioning in the address bar.
That's it.
Good work, keep it up!
(25.10.2006, 15:41)

Volkan Görgülü:-
Hi Stu,
Do you have a solution for the selectbox problem in IE?
(25.10.2006, 19:27)

Unfortunately not. Although some say using an iframe cures the problem.
(25.10.2006, 19:52)

Hey Stu, just one question. Why do you have to type your first name before you can post a comment?! Antispam?
(25.10.2006, 21:47)

Hi Roy, yes it stops the automated spammers as you need to remove the 'My name' and enter the answer. CSSplay was getting upwards of 50 spam comments a day before I added this feature but now I get none.
(25.10.2006, 22:12)

Hey Stu,
I just want to say something about the opacity 1. It works in IE 7, but it looks darker than in Mozilla and Opera. I find it quite strange, it should look th same in all browsers.
(26.10.2006, 06:51)

What a GREAT inspiration you are to me. Beautiful site clean, concise and so much talent. Thank you from some one who still misses DOS.
(27.10.2006, 10:55)

Hi Stu,

I have mixed your Fixed Layout Vs 1 and Ultimate Menu v2. And before posting this post while reading the comments I have explored the problem is about the quirks mode.

If you can check

(quirks mode on and layout works fine but menu does not work correct)

(quirks mode off and menu works fine but the layout does not work correct)

I am going to try fixing this by putting the menu in to a iframe. But if you can share a better solution that would be great.

Best Regards
(29.10.2006, 16:03)

hi its me again,

I have tried Iframe idea but i have failed because I have understand that it will lead me to bigger problems, so i really need a solution now :( about that quirks mode. Any help will be appreciated

Best Regards
(29.10.2006, 16:27)

Stick with the first one where the layout works.
You can always correct the menu to allow for the faulty box model. Just specify the width to include any padding etc for IE using the * html hack.
(29.10.2006, 16:37)

Hi again,

When I enter to quirk mode menu and layout works great on IE7 or Firefox.

But In IE 6 there are problems on menu.

As you mentioned the * html hack I used it on the codes. But for example

.menu a, .menu a:visited {

* html .menu a, * html .menu a:visited {

I change this to

.menu a, .menu a:visited {

and it works on IE6 but does not in IE7 or Firefox. As far as I understand your hacks are for IE 5.5. So do we need to do something different for IE6?

I hope, I am not being a headache. I am just new to these css based designs and want to understand...

Best Regards
(30.10.2006, 17:34)

Abus, to target IE5.x and IE6 only you need to use the * html hack.
For IE7, Firefox etc.
.menu a, .menu a:visited {
For IE5.x and IE6
* html .menu a, * html .menu a:visited {
(30.10.2006, 19:06)

Matt D. Oliver:-
Just a note to your iframe comment: That's a common misconception by many web designers, unfortunately I did it myself at one time, is believing frames will solve spambots from soliciting spam messages through your forms. This isn't entirly true because most spambots nowadays index the entire site and are capable of accessing seperate pages simultaneously.

Other than that, I'd like to compliment you on your outstanding CSS work. Magnificent codes you've got. Keep up the good work!
(30.10.2006, 23:47)

Finally I have managed to finish but I dont know what will future bring. Thank you very much. There is one last point I want to ask. I didnt use any of "width:15px" and I wonder what they are for?

Again thank you very much.
(31.10.2006, 03:10)

Abus, I can't see any width:15px on the original ultimate menu v2 ?
(31.10.2006, 07:52)

Abus, you still have a problem with the vertical position of the drop down menu. If you move slowly from the top level to the drop down then the drop down vanishes before you can select the sub level items.
(31.10.2006, 07:58)

Hi Stu,

(About the width:15 question) It was a general question and I have mistyped it. I mean when do we need to use width:xx syntax?

(About the problem you mentioned) I have tested it in IE 6.x, IE 7, Firefox and didnt experience the problem you have mentioned. You experince the problem with which browser?

And when I first uploaded the files since I didnt hack all the width I have experienced some problems. But when I hack every width for IE 5.x and 6.x, now as far as I examine it works fine.

By the way I want to thank you again for your concern..

Best Regards
(31.10.2006, 17:55)

And now I realized that the symbol I type does not show up. The symbol i used is the left slash.

left slash width : xx

I hope you understand me.
(31.10.2006, 17:57)

Abus, the problem occurs in IE7, Firefox 2, Opera 9, Netscape 8 and Mozilla. Moving slowly from the top level to a sub level causes the sub level menu to collapse. This is usually due to a gap between the top level and sub level.
The left slash width:xx; is used to target IE6 only.
Using the * html hack targets IE5.x and IE6 so to give one value to IE5.x use width:xx; and another value to IE6 use left slash width:xx;
For example
* html a {width:150px; wi[left slash]dth:129px;}
(01.11.2006, 13:05)

Hello Stu, I've been practing this css style menu for a commercial website and would be making a donation to use it. Here's the sample at I've worked on this so that the menu passes XHTML and CSS validation. But for the life of me, I absolutely cannot get it working properly in MSIE 6.0 What am I missing and what is an appropriate amount of donation in USD?
Thanks, jsg
(02.11.2006, 13:49)

JSG, you have an extra <!--[if lte IE 6]></td></tr></table></a><![endif]--> before each closing </ul> which should not be there.
As for donations, I do not fix any amount, but leave it up to you.
Email me stu{at} if you need any more information
(02.11.2006, 17:09)

Sooo embarrassed to overlook this! I removed the offending lines and it works with valid XHTML and CSS. Many thanks for a great menu!
Donation is forthcoming!
(02.11.2006, 19:18)

JSG, glad it is ok now.
(02.11.2006, 19:28)

Dear Stu,

Your website is the ultimate goldmine; very creative and stimulating, and handled both professionally and passionately! Your code "feels" solid and robust, while not missing out on ease of use and friendliness both to the viewer and the coder.

I feel safe that will be well looked after in future browser versions.

(06.11.2006, 09:39)

Hi Stu,

I have fixed all my problems, thank you very much for every help and friendship.

Best Regards
(07.11.2006, 00:55)

Stu, you have a "dead" link, with the new menu.
(07.11.2006, 19:33)

Roy, can you be a little more specific. which link, where?
(07.11.2006, 19:45)

Ah, I see you fixed the dead link (with the definition list flyout-menu). Or my computer is just ... well, let's say "not working correctly".
(08.11.2006, 06:52)

Roy, that link was indeed broken, for about 30 seconds (typo error).
(08.11.2006, 07:48)

Can you help? I want a rectangle divided into quarters so that each quarter is a different colour and the whole thing resizes as one. It sounds really simple.
(08.11.2006, 15:54)

Jacka how do you want it sized. In ems or % ?
(08.11.2006, 22:41)

To achieve result i expected it would need to be %. It's meant to look something like this: but never show a scroll bar - but that would depend on the ratio of the image compared to the browser window. Hence i was dividing the page into four divs and using background-colour.
(09.11.2006, 10:10)

It works better using a jpg instead of a gif. see index2.htm but i'd like to acieve it via CSS
(09.11.2006, 10:39)

Ken Jones:-

I am totally new to this website which I think is totally awesome and made me realise how little I know. I am finally converting to CSS based layouts and use this site as my only point of reference.
I have found a menu on the site that is superb but without being greedy, I wondered if anyone has a way of extending it slightly.
The menu is the (Sliding Tab Menu)b which works superb but I need to add internal links to each menu option, so that when the menu slides down it will display the info text and picture as well as 2 seperate links.
At the moment it just falls apart when I try to add the links. If I am being totally stupid then please let me know, otherwise any suggestion would be appreciated.

(14.11.2006, 17:23)

Hi Ken, you should use my patented method :)
Surround the inner links in a table for IE. and use #menu li:hover span for non IE browsers.
(14.11.2006, 18:54)

Ken Jones:-
Hi Stu,

Thank you very much for your response.
The table solution works fine and I can certainly use it, although I feel even more limited in my ability by the fact that I could not come up with it on my own. I am having trouble with the #menu li:hover solution for non IE browsers because I am not sure how to apply it but I do not want to pester you with endless questions so I will try to work it out.
It is truly humbling to be in contact with someone of your ability who freely shares their knowledge.

Kind Regards

(14.11.2006, 20:12)

Ken, check any of my drop down menus for the method of styling :hover for both IE and non-IE browsers. For instance

Don't feel to bad about the use of tables to exploit a bug in IE, as CSSplay is the FIRST and ONLY website to come up with this solution.
(14.11.2006, 20:45)

Steven Butterworth:-
This is one of those GREAT sites. I have added it to my links page and will explore more very soon.
(17.11.2006, 07:51)

Hamish Low:-
Hi Stu,
and thanks for the helpful info on your site. I've been learning CSS for about a week and already I've found one weird bug in IE7 that noone seems to have anything on yet. I have a site that works perfectly in firefox, yet in IE7 the banner and the main graphic are mysteriously displaced several inches to the right. The weird thing is it is kind of solved by putting this is the <head> section.
<!--[if IE 7]>.
the . could be anything but a full stop is the least obvious character. The result of this is that in IE7 all the graphics are almost in the right place, but the full stop is visible and shifts the banner one space slightly to the right. totally weird, but acceptable in the meantime.
(21.11.2006, 03:52)

Hamish, nothing in the <head> should print on the screen. Check the head area for errors.
(21.11.2006, 09:15)

Andy Hoyland:-
Can I just you appear to be a genius... I've had great fun looking at all the stuff on your site and look forward to being able to use it sometime!
(25.11.2006, 12:54)

What a great site!!! Some VERY interesting CSS going on here. This has been added to my favourites! Great work!
(27.11.2006, 22:32)

Robert Poland:-
I have been battleing with "Fade-out scrolling" and I can get it to work on some (one) pages and not others. See <>. The "Minutes" selection seems to work but the "Links" selection doesn't. I can't find what's breaking it. Would like to add it to the Home page too but it also fails.
(30.11.2006, 01:50)

Hi I need help. On the layout section and single webpage how do i put links into the content section. If i do then its shown before the link is click to show the focus and active states. basically i wish to craete a single page website with links. ps this site has really got me onto webdesign thanks! :D
(05.12.2006, 22:32)

Martti, not sure what your problem is. Do you have a page on the web that shows this?
(05.12.2006, 22:55)

A CSS only drop-down menu with overlap.

Hi, just made the menu works on ie, firefox, opera, however on safari part of the dropdowns remain after moving off them

could someone look into this
(06.12.2006, 07:16)

David A. Guzman:-
Stu you ROCK when it come to css. I use you code for my websites. I comend you man!
(07.12.2006, 21:43)

MC Peko:-
This is great, great art. I love it. Thanks a lot.
(09.12.2006, 03:54)

Martti:- this is the site, i wish to play links inside the em tags so when the content is shown is there anyway fo creating a fully functional website? using one page? cheers nice site!
(09.12.2006, 23:54)

that should be PLACE not play oops, instead of just having text, links would make it more functional as a site, not the best way to create a site but simple none the less!
(09.12.2006, 23:55)

Nick Lozon:-
I haven't seen any menus that are transparent with transparent rollovers. I created a menu and then wrote an article, perhaps you could look it over and tell me why it sucks.

Thanks for everything Stu!
(10.12.2006, 16:13)

Ben Siegler:-

First off, thanks so much.

I've borrowed your code for my page at It seems to be working in every respect except one; the named anchors. It seems that no matter how I adjust CSS settings, the links on the left always bring their individual named anchor up to the very top of the page, beneath the fixed/absolute header.

I've tried extra padding and/or margin space on the "page" div, but no go.

Any help sorely appreciated.

And thanks again!
(11.12.2006, 16:53)

The more I visit this site, the more 'in awe' I am of your work.
Hugely inspiring - so THANK YOU!
(12.12.2006, 21:10)

I was really stunned when i saw your age! So cool u made this website.
(13.12.2006, 16:26)

Nice site, I've been using CSS for about 2 years on and off and I always like to try new things in websites I build. It's nice to see someone who pushes CSS to another level. I have bookmarked the site and will certainly be back!
(13.12.2006, 16:41)

Regarding your stretchy background in your layout section, i just realised something that has to be a must for a background image, otherwise the image toolbar will be permanently fixed in the top left corner all you need to do is change the following line:-

<img id="background" galleryimg="no" src="rabbit.jpg" alt="" title="" />

is there a table or div section version of this stetchy background, that would be a great trade for the info i've given :)

many thanks for your website, i quite often pop by when i am stuck.
(14.12.2006, 04:32)

Barry, you can add a meta tag to all pages
<meta http-equiv="imagetoolbar" content="no" />
which will stop the toolbar from appearing.
(14.12.2006, 11:29)

Your website is really helpful! Not that I've used alot of your stuff :s

Anyway I was wondering iff you could use CSS to randomly display different content in a small box on a web page, or if you would have to use php?

Regards :)
(15.12.2006, 12:56)

Excellent site, very classy, fun and interesting.
(17.12.2006, 19:25)

Martti Koivu:- this is the site, I wish to place links inside the <em> tags aswell as content, so create a fully working singular webpage :D cheers Martti
(17.12.2006, 23:17)

Martii, it can't work. The first click opens the new image and text. A second click will close the active window not activate a link.
(17.12.2006, 23:28)

All, as you can see, the site has a new look. I hope that this is easier to navigate and find what you want. There may be some teething problems but hopefully not too many.
(18.12.2006, 13:21)

Your latest update to you site is very subtle.
The colors, the left-right links (the little images were pretty cool though), is noticeable.
(Have been visiting your site for a while). It is always interesting to read your replys to the comments your readers post. Thanks!

Stu, Merry Christmas.
(18.12.2006, 15:09)

Hi Stu, I really like the new layout of CSS Play! Looks very fresh. Cheers, Gary.
(19.12.2006, 08:39)

Well done on the fabulous reference site.
I am trying to use your 'fixed' layout version 3 (body4.html) but seem to be having a problem with anchors in the content section where the header disappears.
shows the problem
shows the correct layout
If you or anybody else has any ideas Iwould really apprecite it.
(19.12.2006, 15:59)

From on Englishman to another thank you for the time. Your site is refreshing to those starting web design. It still shows that we british are and will ever be the pioneers of the WWW, thanks Stu and Tim Berners-Lee :D
(19.12.2006, 18:58)

Stu! This redesign is great! When do we get a PunBB or something? Heh, Please? I'de like to see you style a punbb forum, it's so easy you'de enjoy it I think.
(20.12.2006, 04:21)

klaas van manen:-
This is just to check if posting a comment works from this page because I only get error messages every time I try to post something from the comments page of your latest demo.
(23.12.2006, 02:11)

klaas van manen:-
So this works! Then I guess you won't get many comments on your latest demo, which is a pitty because it is worth a few lines.

By the way: I had asked myself what on earth you could be doing because your prolific production of demo's suddenly had come to a halt. Your beautiful new lay-out seems to explain everything.
(23.12.2006, 02:17)

klauss, just a little glitch that has now been fixed. You can now post to the latest demo :) and yes, this is the reason for the lack of demos recently. Although it is getting harder to find new ways to use CSS.
(23.12.2006, 10:23)

What is it that makes list items display in a line as opposed to starting a new line every time?
Just wondering. ;)
Lovely site!
(29.12.2006, 18:10)

Benjamin, float:left; or display:inline;
(29.12.2006, 18:21)

Olá Stu!
Obrigada por disponibilizar seus conhecimentos e arte! Feliz Ano Novo!
Adoro seu site e ensinamentos!
(29.12.2006, 18:23)

Claudia, muito obrigada :)
(29.12.2006, 18:40)

Bah, I liked the old design better but the content is still the same old awesome quality. thanks Stu for helping me understand css better than I ever could. I could Play here all day. Merry christmas... Happy New Year... blah blah blah.
(29.12.2006, 22:31)

Cheers Ben, the site change was to improve the navigations and put all the main links in one place. The amount of visitors who could not find the page comments, FAQs and search has been growing steadily so this redesign was to ease the problem.
(29.12.2006, 22:44)

There was a name missing from the Queen's honours list! You have great New Year never the less.
(31.12.2006, 12:41)

Hey Stu. I made some overlapping tabs using css. Check them out here:

Hope you like them. :-)
(02.01.2007, 03:27)

Hello Stu,
i wish u a happy 2007 and keep on doing ths great work!!
greatings t
(04.01.2007, 07:18)

Nick Hopkin:-
One of the best resource sites on the web, without a doubt. I'm always coming back for more. Happy 2007 to you.
(08.01.2007, 23:32)

Daron Jones:-
I have been looking at site design for a few months and was thinking to change my site design. Near Christmas i decided not to. After seeing what you have done tonite i shall start. Stu you are my CSS God.

When you said spoke about the spectrum it brougt a tear to my eye. I remember i could get the magazine for around £1.... Sniff

I hope to have the traffic to you one day!

Daron Jones,
(15.01.2007, 19:04)

¡¡Felicitaciones por el nuevo diseño!!.

Congratulations Stu!!! Great job.

Your site is amazing. Thanks.

Alberto (Rosario - Argentina)
(16.01.2007, 14:30)

Brilliant site Stu. I've used a few of your ideas on my own site. This is by far one of the best resources on the net! Thanks

(29.01.2007, 17:45)

Wow! When looking for a site that could show me the power of (not-so-simple) CSS, to give me ideas to steer away from the table hacks of old (I think I'm still stuck in 1999), I never expected to find a site like this... and it's totally blown me away. Absolutely fantastic, and a real inspiration, thank you so very much!

(05.02.2007, 03:13)

I just found this site looking for ways to use css on my personal site. Lots of good stuff here. I think I an actually make sense of CSS with some of the material from here.

(07.02.2007, 08:18)

Love your stuff! Do you have the snazzy borders with a bigger radius and thicker lines?
(07.02.2007, 16:32)

Dennis, thanks. I have not produced bigger radii or thicker lines. It would take more <b> tags to do this but it should be possible.
(08.02.2007, 10:13)

Jeroen de Groot:-
Wow, you'd turned to a more proffesional look.
I did like the old layout though...
Anyway, i did learn a lot from you're site, but i have a long way to go yet!
(09.02.2007, 21:14)

Best CSS resource on the internet. You should get back into programming though - I'll be keeping an eye out for PHPplay!
(11.02.2007, 11:44)

Julian, there's a thought :)
(11.02.2007, 11:48)

First of all, great site - I spend ages looking round and picking up useful info.

One thing I can't seem to find anywhere is how to create a centered, fluid 3 column site (with header and footer). I've found many examples where the content extends to the full width of the window, but none where it doesn't. I guess this is a limitation of 'float' right?

(18.02.2007, 12:23)

An inspiration to many.
(22.02.2007, 14:27)

I have never used your CSS on any site of mine, I just found this via a friend's recommendation and I don't respect your copyright fully.

I don't mind adding a comment and maybe a link back to your site, but Stu I'm certainly not giving you a donation. I'm sure you make plenty of money off the Google Ads and the advertisement links that are found all over your site. There are so many ads it's hard to distinguish the content from the ads.

Now if your site wasn't filled with ads I could respect your copyright fully. Now excuse me while I take all your CSS and post it for free on my site.

Oh, and I truly thank you Alex for this script.
(03.03.2007, 21:27)

David, where on CSS play does it say that donations are compulsory? You are free to take and use any of my demonstrations and all I ask is that you respect my work and keep any copyright comments in the stylesheet. Now excuse me whilst I spend the next few days producing my next demonstration so that you can take it for free and post it on your site.
It's comments like this that make me realise how much I enjoy my work on CSS play.
(03.03.2007, 21:46)

Oh, and by the way, the Google ads and sponsored ads do bring in enough to keep CSS play a 'free to use' site. If it weren't for these then I would need to make a small charge for using some of my demonstrations.
And finally, just for your information, I have recently spent $100.00 on images for my latest gallery demonstration so that it can be see it at its best and 600GBP on a new laptop PC so that I can test my demos on Vista and IE7 as well as IE5.0, IE5.5 and IE6.
(03.03.2007, 21:55)

David... really, if you have that big of a problem with cssplay then go somewhere else. Adverts are common and most free sites have them. If you feel you can't cope with them then get an adblocker. Seriously, Stu puts a huge amount of effort into this and has been doing so for a long time so the least you can do is be grateful rather than be an arse about it.

In any case, I was wondering if there was some way of using CSS to force IE 6- to conform to a standard box model? This is the problem: I have tables with column-spanning cells. The length of the text within these cells varies. Now, when IE displays cells lower down in the table, the non-spanning cells vary in width according to the length of the text in the spanning cells above. The left most cell has a defined width yet stretches according to the spanned content. This is ridiculous! Is there no way of forcing IE to use the defined widths and only stretch cells withOUT defined widths? IE 6- is a nightmare!
(07.03.2007, 06:47)

Gareth, do you have an example on your website that I can view?
(07.03.2007, 08:04)

Hello Stu.

Have you though of creating a newsletter feature on css play to be informed when a new tutorial has been posted ?

(09.03.2007, 09:38)

Hi Christ, the RSS feed will do this for you. Also the Home page has a 'Latest demo' list.
(09.03.2007, 10:27)

Hi Stu, first of all, thank you for having a site like this where it shows demonstrations of what CSS can really do. I am still low down on the learning curve, I have used one of your flyout menus, although I did have some hard time getting some of it to work (this is all to do with my lack of understanding not your code), I will email you as well to talk about how you would like me to go about respecting the copyrighht etc. Last comment, there will always be those that do not see why they should not get things handed to them on a plate, and rarely say thank you afterwards, pity really.
(10.03.2007, 09:49)

thank you very much for this gorgeous site. it really helps learning and understanding css! THANK YOU!
(15.03.2007, 12:19)

Mad 4 CSS:-
Nice Site Stu,
Lots of interesting CSS goodies.
Do you have any Fluid CSS Photo Galleries so that they work in all res's not just 800 x 600 say ?
(16.03.2007, 15:11)

No fluid galleries. not sure if it would be possible to have a fluid gallery because of the positioning of the full sized images.
(16.03.2007, 15:56)

Hello Stu,
Great site! I like it.
Stu have you thought of making your own CSS cook Ebook? I am sure it will be quite successful.
I have sent you an e-mail some times ago. But as you said, it takes some time for your to reply due to amount of the latter coming.

Any way, what do you say?
(17.03.2007, 03:45)

Thanx for the teaching!! You really are a CSS hacker :)
(26.03.2007, 23:59)

Hey there!
Perhaps you could write on how to make CSS tables? They seem interesting!
(28.03.2007, 19:24)

I have problems with your Menu #1 under Examples of drop down menus, the dropdown doesn't work with IE 7.0, is there a way to solve it? Otherwise what other drop down menus do you suggest will work on 7.0? Thanks
(29.03.2007, 10:57)

Char, all the menus on CSS play work with IE7. There are several reasons why you may have problems, but the main reason is the doctype. See the FAQs.
(29.03.2007, 13:03)

Melissa, CSS tables is not well supported, the most obvious lack of support is in IE, but FF and Opera do not fully support them.
(29.03.2007, 13:05)

Hi again,
I tried all the Doc types but it still doesn't work in IE 7, any idea what i need to add to the CSS of Menu#1 in dropdown menu examples.
(30.03.2007, 02:53)

Char, without seeing the page it is difficult to say what might be wrong. You can see that it does work on CSS play using IE7.
(30.03.2007, 10:03)

Your examples are pure genius. Never have I found a single CSS resource of such quality and all in the same place. Thank you!
(04.04.2007, 11:00)

Who's the girl on your website?
(08.04.2007, 04:03)

Stu, love the site, always my first place to visit for inspiration, especially the menu's.
For my latest project, however, I was wondering, inspired by your Non-rectangular links, how would you go about a lightweight honeycomb arrangement for links?
(13.04.2007, 12:49)

Jeeves, honeycomb shapes for links are possible but they would require a lot of extra markup. I do have a demo here that may be what you are looking for.
(16.04.2007, 10:07)

Hi This is bob again.
Simplest photograph gallery does not work FROM your sight in IE7?? Unlerss I have some option set up incorrectly? Works in all the other browsers.
(16.04.2007, 19:47)

Bob, try it now.
(16.04.2007, 19:54)

Hi Stu, hope this isn't a double post as I can't see my comment any where, so here goes again. Thanks for a great site, im new to this and have learn't loads from you. Im having a problem with the photo galleries. The pictures revert back to the preloaded one in IE when you like on the scroll bar or anywhere else on the screen. But its fine in FF. Is there a work around or is it just IE again.

Big thanks again Stu for some amazing tutorial/demos.
(18.04.2007, 09:47)

Stu, thats probably easier than what I'd have come up with, so many thanks ;-)
I'll be sure to link your site in the css.
(19.04.2007, 05:38)

Stu, your site's an inspiration for a retired guy trying to get to grips with CSS!

Your "Fixed Layout version 3" is pretty much what I've been trying to achieve, but I don't need the footer.

Just a couple of questions:

1) I didn't want to trigger IE7 into "Quirks" mode so my first line is:
<!--[if IE 6 ]><!--IE6 to quirks mode--><![endif]-->
Does this seem OK to you? IE7 seems to stay in "Compliant" mode despite seeing this comment.

2)Any reason not to use "position:fixed" for the "non-hack" elements of the "head" and "left" divs?

Keep up the great work!
(30.04.2007, 10:45)

Steve, if you check the FAQs you will find that you can use <?xml version="1.0" encoding="UTF-8"?> as the first line, which will keep IE7 compliant and IE6 in quirks mode.
As to position fixed that should be ok.
(01.05.2007, 12:10)


Thanks for that.

I was unsure if the <?xml version="1.0" encoding="UTF-8"?> trigger only worked before an XHTML DocType declaration - and I'm using HTML.

I've found it quite handy to put this "mode trigger" in an external file and call it up with a PHP "inlude" statement on each page. That way I can easily modify it to flip my IE7 browser between Compliant and Quirks mode when I'm testing.

One of the sites I'm working on is

I've still a very "raw beginner", but thanks to sites like yours I feel I'm making progress!
(01.05.2007, 12:28)

Great site. I'm curious if there is a way to make the zoomed image lock if you click an individual dd item from your master image map demo. If so, then I'd also be curious in how to unlock it. ;_)
(04.05.2007, 01:26)

Mark, the usual way to make an image lock is to use :active /:focus , however, this doesn't work in Opera and Safari. To make it unlock you just click off the image so that the :active/:focus state is lost.
(04.05.2007, 07:56)

Thanks for the info. One new question: Is there a way to control the positioning / visibility of one <dd> item when the :hover is triggered for a different one?
(04.05.2007, 16:44)

Raj L.:-
Excellent website. I've been reading Andy Budd's CSS Mastery - I have to say that you do stay true to the CSS experts! :)
(08.05.2007, 07:00)

great site, very helpful tutorials, what can I say.. Thank you for passing on your knowledge.
(09.05.2007, 21:07)

Hi, Stu Nicholls. Thanks u very very much. i am a beginner at web programming. and i get many help from ur site. can i get ur mail address. please send ur address to Thanks again.
(15.05.2007, 06:08)

Lifo, just click on the 'CONTACT ME' link at the top of the page.
(15.05.2007, 10:05)

Cathy Dee:-
HI Stu,
am attempting to build your beautiful 'it's a dog's life image gallery. Just put in the style container span to 'remove' images but it hasn't done tht - it hasn't done anything. Wondering if I am missing something here - am I supposed to add the span class to the div tag - tried this to no avail - what happens here?
Cheers and thanks
(16.05.2007, 21:31)

Cathy, make sure you are using a standards compliant doctype.
(16.05.2007, 22:06)

Great Vertica menu, just what I was looking for, thanks ;-)
(26.05.2007, 10:43)

Hi Stu,

Just wondering if you have a fix for the td and tr hover problem with IE? I really dont wanna use Javascript and you sees to be the only guy who can do wonders with CSS. Any input?
(28.05.2007, 22:12)

Nelson, what problem is this? email stu {at}
(28.05.2007, 22:40)

great stuff here...really has got me into using CSS for my sites....

I have a question re a flyout menu...if I use images for the top level links I want to be able to show a title for the link at the end of the menu..




so that when I rollover the [img2] the menu comes out and the [title] changes to 'products' for example. And when I rollover [img3] another menu appears and [title] changes to 'services' etc

thanks for any help anyone
(29.05.2007, 10:24)

Hi Stu,

This is in response to your query about the problem i have with hovering over non link elements in IE.

I am working on a horizontal navigation menu and i noticed that i couldn't get <td> to change background color on hover. Also, i want the background color to stay once the link in the td is clicked. There is a workaround with JavaScript but i was wondering if you had a better CSS based solution?
(29.05.2007, 18:45)

Nelson, do you have a url for this menu to see how you are using navigation in tables?
(29.05.2007, 20:00)

Your new lay-out for ths homepage has some bugs in it. The text of "experiment with..." isn't visible anymore. Or maybe it's just my browser.
(03.06.2007, 10:24)

Nevermind, it was my firewall which was blocking certain things.
(03.06.2007, 10:25)

Roy, it was probably your cache using the previous stylesheet. The heading hs been redone to make the FAQs, Contact Me etc more easily seen and also to simplify the look.
(03.06.2007, 16:51)

Hi all, unfortunately I am currently stuck in Spain due to unforseen circumstances.
This means I am unable to reply to any comments or emails at the moment.
I will try to respond as soon as I get back.
(26.06.2007, 12:32)

Hi all, I am back in the uk and will start answering emails etc shortly, but please be patient. I took a one week holiday to Spain with my wife, but unfortunately two days before we were due to fly back, my wife broke both bones in her ankle. The quick story is that we were flown home last night, with my wife now in a uk hospital waiting an operation.
(01.07.2007, 13:53)

Stu, getting back to normal but I will not have as much time for questions for the next 4-6 weeks whilst my wife recovers.
(12.07.2007, 14:23)

Mike Worley:-
Hi Stu:

I was wondering if you could combine your slant menu with a drop down function. I played with the slant menu trying to add a drop down function but couldn't even come close.
(12.07.2007, 20:53)

Not Reffering You Now:-
You didnt have to be a jerk about your images. You could have just emailed me or left a comment on the blog. I wasnt doing it intentionally! I wanted people to know how great this site was so I referenced an image and a link so people would go to your site.

Anything would have been much easier than the way your handled your bandwidth problem, you did that just to be spiteful. I understand now why the Irish hate you people.
(17.07.2007, 20:27)

Not reffering to you now, I don't know which site you are referring to but I have recently found MANY site linking to my images, the latest one is which is using 13 of my images to push a page of Google ads! This site is still linking to mine. If you wish to link to my images then it would be common courtesy to let me know. I can then add your website to my list of those allowed to link.
Please email me stu{at} with your web page and why you want to link to my images.
(17.07.2007, 20:54)

I have now removed the alternative image download. Anyone linking directly to images on CSS play without permission will not get an image at all. Please respect the copyright of these images and ask permission first. Most of the images on CSS play have been purchased from for use on CSS play and are copyrighted by their various photographers.
(17.07.2007, 21:02)


I love ur site but really need ur help. How can i get words to slide in my footer kinda like the ESPN ticker. This would finnaly finsh my page.

(30.07.2007, 21:10)

Zack, I think that this is possible using javascript but not CSS.
(30.07.2007, 21:23)

oh ok,
thanks anyway stu,

(30.07.2007, 21:38)

Stu, Thanks for all the work. I love the site.
(03.08.2007, 17:29)

I've used your code to successfully make several sites much easier to manage than with js menus. For some reason this site won't behave in IE 7. ( I've used z-index to keep the flyouts on top of the center content, but it isn't working. Any hints. You're such an inspiration!
(08.08.2007, 20:57)

Marc T:-
Hi Stu,
i just discovered the possibilities of making a site using a Layout created in PS. There are lots auf Turorials for Stuff like this:
That Stuff looks great, but is there any way to use it on a website without using tables? I cant figure out a way to place the links like that with just CSS...Do you have an idea?

(10.08.2007, 21:13)

Marc, it is always possible to do this with CSS. Just create a div to hold the image in the background. Give it a position:relative; then place the links over the correct areas of the image with position:absolute;
(10.08.2007, 21:18)

Marc T:-
Hi Stu,
me again,

maybe you could work on the alternative Image Download, because now we can't check for example what picture you set as background. If you try to find out how imagemaps work, this is not realy supporting :( maybe you can figure out a way to determine this...

(12.08.2007, 19:35)

Marc, if you know anything about html and css you should be able to get all the information on the images used. Their paths are there for you to follow, and with this you can enter the full url in the address bar and see the images.
If you use Firefox and the Web Developer Toolbar you will be able to see all the images used with the menu 'Images' > 'View Image Information'.
(12.08.2007, 20:39)

Marc T:-
Well, I tried to, but when i entered the direct path I came to the 404 Error Page...
Anyway, my Problem is solved and if nobody else is cares

(15.08.2007, 21:19)

I have a menu text that links to another page and a separate image that links to the same page. Can I use CSS to highlight the text when I hover over the image? Basically, hovering the image also activates the text hover, even though the text is not being hovered. Thanks Stu. (p.s. - does not need to work vice versa.)
(16.08.2007, 20:10)

Jay, you will need to have the image and text in the same link for css to apply to both on hover. If they are in different links then hovering over one cannot influence the other.
(16.08.2007, 20:29)

Daniel R.:-
I am an aware of your email, and such sir, so I am asking you here, could I use the jack in the Box source on my website. ?
(26.08.2007, 21:38)

Daniel R, my email address is given at the top of this page, and also on the 'contact me' menu item.
(26.08.2007, 21:59)

Stu -
I'm trying to experiment and combine two of your menus. I'm hoping to use your "professional series" single line menu with your "simple horizontal drop line" menu. In other words, have a menu that looks like the one at the top of your cssplay site, but have a horizontal dropline beneath the menu with options that change depending on which button you are hovering over. Just like your tabs menu with the dropline, except with button instead of tabs or sliding doors... I'm also trying to have the dropline and it's options remain visible for the currently viewed page, unless someone hovers over a button, at which time the dropline list would change.

I would be happy to donate for your advice on this! Thank you so much for a great site.
(05.09.2007, 18:37)

Adam, I have been working on a pro dropline menu for a while now that uses sliding door images for the top level and a background image change for the dropline, the whole menu being centered. This has been incredibly difficult to get cross browser but I have finally found a solution and will be publishing tonight (hopefully).
(07.09.2007, 09:11)

You have some great stuff posted. Love your site. The only post I have seen for newspaper columns is with a table. Can it be done with only css? I searched your site, but didn't see anything like it.
(14.09.2007, 20:39)

harm, if you mean that text will overflow into multiple columns then this will be possible. See
(17.09.2007, 15:34)

I am trying my hands on css for the first time. I need to know how i can distinguish my visited links from the active ones
(28.09.2007, 02:58)

Vladimir Mincev:-
Stu, your site IS listed on

2006-07-31 Stu Nicholls offers CSSplay, a site with CSS examples, including many uses of ':hover'.
(01.10.2007, 14:02)

Hurst VanRooj:-
Hi there - can anyone solve this - if I right justify the nav bar the 'list' is the wrong way round, so I have to write it like this

So that it reads
Home - About - Contact
(02.10.2007, 11:54)

Hurst, try
ul {padding:0; margin:0; list-style:none; text-align:right;}
li {display:inline;}
(02.10.2007, 13:21)

My weekly visit gave me lots of ideas, specially about menu making and styling. Just posting a great big ol' thank you, Stu. You are the foremost authority in CSS ;)
(03.10.2007, 07:58)

andy c:-
stu, using the 'Fixed' layout version 3 and it is fine in all browsers except IE6 where you cannot scroll all the cotnet part of the page, it leaves about 100px at the bottom hidden. Works fine in IE 5.5 and IE 7 ?????? Also fine in netscape and firefox.
(03.10.2007, 14:56)

andy c, check that you have the line '<!-- Put IE into quirks mode -->' as the first line of your code above the doctype. This works in IE6 as can be seen from my demo.
(04.10.2007, 15:45)

Your site is simply awesome.Never seen so much generosity.I have been following your posts almost every day.Hope to build my own site by year
end.Thank you so much for your guidance.
I will definitely link to your CSSplay .What a great idea in software play in css.
(23.10.2007, 16:12)

Yusuf Akyol:-
I liked too much your "tree frog click menu". Is it possible create another one with "mouseover" instead of "click"?
(24.10.2007, 14:15)

Stu, you are a really Gay scammer. Where is the source ? Stop being a bitch and put the source nicely in a file with instructions.. rather than scam people so they get so lost they end up clicking a google ad or you. just hate dishonest old idiots like you
(27.10.2007, 18:30)

Johny, if you bothered to read my home page or even the FAQs you will see that the information is easy to find within the source code, and that my latest examples have zip files to download. CSS play is my playground, and if you like what you see then it is offered free of charge, although many visitors do make donations to support my work. And after all 25 million hits a month shows that CSS play must be doing something right. However, no one is forcing you to visit.
(27.10.2007, 20:13)

I've been learning a lot about CSS in visiting your site the past year. I have a question concerning displaying more than one hidden picture. My goal is for a user to click on a menu list item and for that trigger to make visible a hidden image that corresponds with the list item.

So if you were to scroll on the menu and hover over the link "lions" it would trigger a picture of a lion to become visible somewhere on the page, where once it was hidden.

If I'm asking this correctly I hope you can help me.
(02.11.2007, 13:28)

You really have some great stuff out there. Can you tell me but how can the submenus be layered above another div.
Coz they currently hide beneath the div next/after the #nav.
(13.11.2007, 22:01)

Sanny, this is a z-index thing. Give the #nav a high z-index and give the following div a position:relative and a low z-index;
(13.11.2007, 22:19)

Anh Tran:-
Hey Stu...this is a great site you're running. I searched throughout your site but I still cannot understand how this submenu is done.

On the sub-navigation, it seems as if on hover, the background image and color is changed, the image being the arrow floating to the left and the color simply changing to red.

However, when the text is shifted to the right by 15px, it has a very smooth motion. When trying to set the padding to change 15px on hover, I get the result of a very swift and unsmooth motion. How can I get it to be as smooth. I have also seen dropdown menus smoothly dropping as if it were a flash animated tween.
(24.11.2007, 20:10)

Anh Tran, the menu, to which you refer, is done using javascript.
(24.11.2007, 20:34)

Anh Tran:-
Oh wow. I just noticed the javascript file specifically for that menu. Thank you Stu!
(24.11.2007, 20:44)

Very good!!!
I've seen your CSS-Menus and Round Boxes without Graphics. I think I use them on my Webpage, too. You will get a Link allready.
Very, very good!!!
(01.12.2007, 17:39)

Vaishali Patel:-
Hi Stu...I recently followed your tutorial on the page
And found it a great learning tool.
I was wondering if you had any tips on how I could load the images from a directory rather listing each one in the code?
(06.12.2007, 09:38)

Richard (UK):-
Re the comments of Johny:-(27.10.2007, 17:30)
Only just seen this but is it really required to be so insulting?

This is a great site where an awful lot of effort has gone into showing what can be done.

Why should anyone even bother to help folks like you.

Thanks Stu for all your hard work and help.
(09.01.2008, 10:59)

Hi, Stu. I think you should correct a copyright years in the footer. ;)
(13.01.2008, 18:21)

I'm using the dropdown pro-dropline image menu. How can I get it to center on the page?
(24.01.2008, 21:27)

I've been surfing the net for a while (months) gathering info about HTML CSS Javascript... and I must confess that this site (+ his little brother: CSS + JavaScript) is way at TOP! Really, really good stuff! Congrats and thanks!
(07.02.2008, 22:57)

kevin moran:-
Mr. Nichols,
Thought I should let you know we intend using your beautiful Pro-dropdown menu for one of our clients.
Truly elegant code. Thank you. Naturally, we'll link it to you and give you due praise.
(09.02.2008, 18:59)

Kevin, please see conditions of use for commercial websites.
(09.02.2008, 20:09)

I develop cms system with php, and i would like to use your menu as default option, but i have problem with fixed width, how can i make variable width menu items.
(27.02.2008, 19:15)

Edin, please contact me stu{at} to discuss this
(27.02.2008, 20:07)

Please visit my web site and send your valuable comments.

(11.03.2008, 12:26)

Hi Stu!!!
Yours site is quite useful...
I have learning CSS by downloading templates and copy them and explore them, every time I learned something new, that way I came to yours site too, it was link in one of templates.
(23.03.2008, 12:37)

Hi Stu,

great work, great site. Thanx.
(19.04.2008, 22:17)

Isabelle Rolland:-
I have followed your tutorial and realised a photo gallery for my site and wish to thank you very much for that. My site is not yet online however I wanted to ask for your authorization. I have put a link to your site under the gallery. I am French and this site is the first one that I do on my own (for private use:-)) and I try to get the cleanest possible code and the fastest loading and I love the way your are doing such great looking things with so simple coding. with my thanks and regards.
(01.06.2008, 08:19)

Roland Gottschalg:-

Congratulations for this great website.
I'm from Germany and my English is not so good.
Ich habe heute diese Webseite in meinen Webkatalog aufgenommen, da ein Freund mir diese Webseite empfohlen hat. Ich hoffe das es mir auch mal gelinkt, soviel CCS auch von dieser Webseite zulernen, das ich es eines Tages auch selber anwenden kann.

Viele Gruesse aus Deutschland und noch weiterhin viele Ideen fuer uns alle.

Roland Gottschalg
(11.06.2008, 20:47)

what happened to the comments posted yesterday?
(12.06.2008, 07:23)

Jay, yours are still there. You posted on the 'Contact Me' page. They are only viewable from the page on which you posted.
(12.06.2008, 07:50)

i love your site stu :)
keep up the great work!
(23.06.2008, 08:18)

Thanks for an amazing collection of demonstrations and effort! Integrated a few components into if you're interested (no I'm not asking for help!)
(07.07.2008, 06:00)

CSS play is an awesome site. I have learned so much! Thanks
(14.07.2008, 16:38)

So your site just shows what you can what? How do I get that stuff onto my website? Do I have to read every single page to find out? For a site where content is everything you certainly don't show how to go from your site to my site very well do you?
(15.07.2008, 01:45)

Pierre, it's a shame that some people expect everything handed to them on a plate. CSSplay is my showcase of what can be done using just CSS, and you can't even be bothered to read the FAQs.
(15.07.2008, 07:35)

Hi Stu,
this is a fantastic and helpful site. CSS ist a really perfect way to use for websites. Anyway, I checked all the demos and couldn't find something I have to do. I have a row of small boxes turning their color on mouseover. How to give some additional text underneath the little boxes? Here is the script:

<style type="text/css">
body {background: darkblue;}
#rollovermenu a {
float: left;
padding: 10px 0 0;
overflow: hidden;
height: 10px !important;
width: 15px;
display: table-cell;
background: url ("boxroll.gif")
0px 0px no-repeat;
#rollovermenu a:hover {
background-position: 0px -10px;
#rollovermenu a:active {
background-position: 0px -10px;
(24.07.2008, 10:14)

So I am newbie in CSS. I am learning CSS yesterday, and I has love CSS. Good luck CSSplay. Thank's
(26.08.2008, 08:39)

I looked for logo to add to the css-play link I'm about to add to my site but didn't find one
(14.11.2008, 09:44)

There is a button on the home page you could use.
(14.11.2008, 09:56)

This is Simon. I like css play. But I got some doubts regarding it. So please clarify my doubts.

(20.11.2008, 03:11)

The header is looking wonderful...refreshing change
(21.11.2008, 20:23)

A small change but it does make a difference.
(21.11.2008, 22:13)

Your menus website is great... as all your sites are. Thanks those examples will give me more of a different look for my layouts. I love looking and figuring out code and yours all make sense once I look at it closer. Thanks again Stu... CSS is very powerful and is a shame that people still revert back to tables when tables are not needed just some 'good old CSS'... TTFN... Andrea
(15.02.2009, 19:04)

WOW! I'm a fairly new web developer and I think it is AMAZING what you are offering here. The answers to so many things. It's hard to believe one person could present so much content. Thank you very much! Nice to see someone a little long in the tooth (such as myself) putting so much effort in a "young" persons world. The passion shown here motivates me to embrace and explore my own passions. Thanks again for all this terrific work!
(21.03.2009, 00:14)

Right on, Stu. CSSPlay is a great resource. You have really done a fantastic job. Who is that girl in the striped dress? Wow! Gorgeous!
(24.03.2009, 07:11)

Ravikumar V.:-
hey Nic, you are my CSS Guru, Hats off you :)
(31.03.2009, 06:45)

Ravikumar V.:-

Ravikumar V.
(10.04.2009, 08:12)

Hi Stu. I'm using your any width drop down menu and it appears to be moving all over the place when navigation around the site. It's currently on this site:

I'm using Firefox/PC and also does it on Firefox/Mac.

(09.05.2009, 02:47)

You have altered the stylesheet. With your menu you do not need the top level centering so just give it a fixed width (809px).
(09.05.2009, 07:45)

Hi Stu
I am a big fan of your CSS tricks. Just can Hats off to you. Great work and imagination to use those things.
(09.05.2009, 14:26)

I get lot of knowledge from your blog reading
(09.05.2009, 14:27)

Hi Stu, thanks for your reply. I've took the centering off #menu and fixed the width. It still does the jumping thing where the menu drops down, but not as much. What else could it be? I've even loaded up your stylesheet up and it did the same.

I find it very strange as it doesnt make sense as to why it does that :S

(12.05.2009, 11:05)

G. Klebinger:-
Thanks! The Css-Layouts are a huge help!
(03.06.2009, 20:36)

Your Pure CSS Image Gallery is absolutely the most stylish and functional photo album that I have seen but the images seems to be only gif, jpg. I tried apploading my flash swf images. It does not allow. Can you please tell me how to do this.
I appreciate your assistance
(05.06.2009, 10:10)

i like the design of your website also, cssplay awesome i'm a regular visitor of this website.
(24.06.2009, 11:24)

links of london:-
Hi Stu ,i like your design very much.and i know a lot of knowledge now,Thanks.
(07.07.2009, 07:08)

CSS play has just changed hosts, so if you noticed any down time lyesterday then this was the reason.
(03.08.2009, 09:13)

john harwood:-
I have dowlnloade your filmstrip gallery. Is there three images that I need to duplicate your site? And do I make the negative image?
(27.08.2009, 20:17)

Stu- great stuff! Thanks for your hard work. I'll use your menu and link to you site.

(17.09.2009, 09:17)

Nice of you to delete my comment Stu. It isn't like it was ad spam or something. What's the matter? Oh I guess you wouldn't want you readers to know the truth.. Though I guess it is understandable, most people who do bad things don't want people to know about it.

The fact is, half this guy's code is taken from other people's work without giving credit, the half that isn't taken from others is non-essential for the given techniques. and then he expects you to ask his ever so gracious permission to use it.
(15.01.2010, 19:07)

It is sad and pathetic that you act like you can copyright this garbage at all. You can't. You can't copyright some boxes in specific positions that are done with a syntax that is meant to put boxes in specific positions. Are you going to try to act like you can copyright squares next?

Hey check it out, I'm Stu Nichols!
"look what I saw on someone's site the other day. they were humbly giving this away for free without limitation."
© 2005/6/7/8/9/10 stu nicholls. Ask me and maybe I will allow you to use that bit of code because I am soo generous aren't I. You should express gratitude and give me free backlinks now because I'm a lying thie- uh, I mean, king of you all.

And no, mr Stu Nichols, css is not complex. It is moving some elements around on a page. It is simple. It is not some complicated program that you can copyright. Maybe it seems complex to your simple mind, but it is not. Also, nothing you have done here is even remotely original anyway.
(15.01.2010, 19:11)

It is funny too because the code which you take from others is usually far less functional once Stu gets done mutilating it. It is obvious that you don't really even know what you are doing. Nice spam filter by the way. did you come up with that all by yourself?

I suggest you tread lightly, because karma can be a painful eye-opener.
You really should be ashamed of yourself, and be gone.
(15.01.2010, 19:12)

Hi Eye,

You are a sad little bunny.

I will leave your comments up so that everyone can see how sad you really are.

To say that these demos are not copyrighted is to say that someone who writes a book cannot have the copyright as they just use words which are in the public domain.
It is not that I use html and CSS it is how these are combined to make something that has not been done before.
(15.01.2010, 19:17)

Except that:

A: it has been done before. About 1% of what you show here is actually original and that 1% stinks.

B: By your metaphor, you have not written a book, you have written a simple little construct of the language in question. Your whole website is akin to a book, thus can be copyrighted. Your demos are akin to simple little English constructs like "cat's can see" or "please be quite children" you can not copyright simple functions of the language.

C: the point made in B: triply applies if you just took your simple little construct from someone else' site and made some trivial alteration to the syntax without changing the functionality.

D: it is completely irrelevant because there is no action you can take to back up your 'copyrights' because no court would side with you.

E: You are simply a pompous ass, asking donations for the privilege to beg your permission and abide by your terms for things which weren't even your own ideas, and which everyone else is giving away for free and without conditions. Everyone else also gives credit to the true originators even though it is not 'required', except for you, who tries to pass others' work off as your own.
(15.01.2010, 21:31)

So my point stands that you should be ashamed. You are a disgrace to the webdev community.

Everyone, please just find the same functionality elsewhere and give credit to the ORIGINAL creators, they are actually good people, not frauds.
(15.01.2010, 21:34)
real good stuff
(01.02.2010, 12:43)

Hey Eye ... I think you are only jealous of Stu,
because u are to st**** to do these greate things!!

The only thing u can do is to open one's trap about it ....

Show us better things like that ...
Show us your site!!!

And by the way, thanks very much Stu i write my skilled work about CSSPlay and this site inspire me a lot!!

(10.03.2010, 10:48)

Stu, who's the female wearing the nice skirt on your home page?
(27.03.2010, 11:06)

Martin M:-
Brilliant site, thanks for all your hard work and inspiration and for sharing it all with evryone. An OBE for Stu!
(03.06.2010, 13:06)

Hi I am having trouble emailing you at
(02.08.2010, 03:48)


(05.10.2010, 07:23)

Excellent. CSS lay out gives more information and it is really helpful.Keep posting this kind of stuff.
(02.12.2010, 10:13)

steve wauh:-
It is very good collection of demos, but need some more clarification for new web desingers.
(02.12.2010, 11:18)

A Vision Board:-
Hi Stu. I may not be a computer genius that's why I am here at your site. All I can say is that thank you for the help and information you have posted here. I am actually on the verge of putting up my website which is and you have helped me a lot especially in knowing CSS. I hope if I have questions in the future, you can help me out.
Cheers and More Power!
(09.01.2011, 01:13)

Design Straw:-
Brilliant site, thanks for all your hard work and inspiration and for sharing it all with evryone.
(20.01.2011, 09:04)

Absolutely Awesome Site ... Thanks for such great work.
(22.07.2011, 16:43)

Jan Nyemcsok:-
/*fix the hover/focus '~' and hover/focus '+' problem in safari and chrome*/
/*html{-webkit-animation:safariSelectorFix infinite 1s}
@-webkit-keyframes safariSelectorFix{0%{zoom:1}100%{zoom:1}}*/
It's messing with 'form selection'
(17.09.2011, 10:11)

This fix is a keyframe that does nothing so should not mess with any form action. The only way that this might affect it is using tabindex for the links. Just set this to a value that does not cause a problem with the form tabbing.
(17.09.2011, 13:02)

I like the new layout of the site!
(21.03.2012, 16:48)

No ask for help but congratulations on your Gallery layout!!! It looks just fine and I tried it! Easy done! You did a great job!
(12.11.2012, 12:09)

I liked your css tutorial for imagemaps. A pity that it works only with rectangular areas. Wished I found something similar with polygons where link text appears below the image when the hotspot is hovered. On I use a map of the German federal states and needed js to change the pics...
(31.05.2013, 14:26)

I wonder if CSS3 offers possibilities for a sleek looking form on a website.
(20.10.2013, 11:40)

Simon Dale:-
please send me the code/link for the following. I have donated a fiver. It is not for commercial use. Thanks
(27.11.2013, 12:28)

Am highly impressed with your responsive multi level menus. However for some reason neither of them seem to be working with the stock browser on the Android S2. Will double check on some other units but I just wanted to bring it to your attention. If I can get it to work I will definitely be buying.
(10.06.2014, 11:39)

The stock Android browser does not support the styles used in these menus. In fact it does not support many CSS3 styles. I am not sure why Google still ship this browser with Android devices. Chrome is a much better browser and support all the latest styles.
(10.06.2014, 14:01)

Great site!

I am trying to make an image menu with image maps with the following requirements:
* Horizontal menu with thumbnail images as menu tabs.
* when thumbnail clicked- opens/magnifies the image in the same window
* and Magnified image has image maps which opens the links.

Let me know if it is possible :)
Thanks for your help
(05.01.2015, 12:28)

I love your site !

I am your fan ;)
(05.03.2015, 19:22)


Why not make a demo displaying the basic graphic capability of CSS. 2D shapes? Basic bevels or and blocks. Or something like this. The simplicity of border colors and shades.

(10.04.2015, 23:36)

Hi Stu!

Thanks for your excellent site and sharing all your ideas with us! On my website I have panels which slide in when menu items are clicked. These resize as the page is resized (within limits). Check this on What I am looking to do is have a gallery inside one of these fly-ins where the thumbs resize so there are a fixed number across, say 6. If there are more than will fit vertically then the excess are hidden. No scroll bars but your clever slide the next set up into view is cool. Then finally when the thumb is clicked the image flies out like zoomfly and fades in at the same time. One difference is it zooms out of the fly-in panel and over the main pic.

I would also like the page to write its html on load based on reading an image directory.

So zoomfly gives me some of it but with fixed sizes, permanent image gallery gives me the sliding sets, no galleries are completely resizable but I can do this div's like my site itself.

Do you have something that does all of this, do you already have one that does the dynamic resizing or do I need to start writing some javascript (or learning PHP or jquery)?
(16.03.2017, 19:43)


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