Mobile Friendly Website


Doing it with style

Sliding doors centered COMMENTS

Welcome to my Comments Pages

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

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

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

Post a comment

Current posts

those conditonal statement spose to show at the top of the page as a joke? ie7

can we make these top and bottom like the snazzy tabs?

keep up the awesome work Stu! many thanks
(02.02.2007, 23:44)

Hi, I'm fervent of your site. This centered layout has a strange issue I tried to fix months ago: in Firefox 2, if you repeatedly increase and decrease text size, the tabs get on top of each other... Any idea?
(03.02.2007, 02:22)

my2cents, that's what comes of not checking the results in all browsers. Just a typo that is now fixed.
(03.02.2007, 10:07)

guibog, this is a bug in FF to do with the float:left; in the <li> style. If you delete the float:left; the tabs do not wrap (but the tab style is corrupted). I haven't found a way round this...yet.
(03.02.2007, 15:18)

How do i get it so on different pages it looks like the i am on that tab, like on the menutab
(06.02.2007, 02:14)

Hmm if that is not possible ...
can i make it work with
<!doctype html public "-//W3C//DTD HTML 4.01 Transitional//EN">

it pretty much works fine , except hover in ie and it screws up the alignment a little in ie.. any help would be appreciated ..

Well i am trying to put it in a oscommerce website and if i use the doctype that is specified in the menu it messes up the website...
(06.02.2007, 05:10)

joe, I have used the <body> tag to hold the id of the selected menu. The stylesheet takes care of the styling of the selected tab.
The doctype you specify is not standards compliant so will mess up this menu. You will need to use a standards compliant doctype. See my FAQs to find one that suits you.
(06.02.2007, 13:00)

I have checked the faq.. Doing this doctype makes the menu work fine, the oscommerce site does not like a valid doctype i guess... Well thank you for your response anyway..

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
(06.02.2007, 16:31)

The hover does not work in ie6? It does not seem to work even on your website
(10.02.2007, 15:55)

fireball, you are right, the hover does not work in IE6. This is explained on the 'A List Apart' website demonstrations (with a workaround). All this demo does is show how to center the 'sliding doors' tabs and make them 100% clickable.
This is not an original CSS play menu and it just uses li:hover for mouseover which does not work in IE6.
(10.02.2007, 16:42)


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