CSSPLAY
Doing it with style
Doing it with style
Every page has its own comments. The links is situated at the top of the page under the main menu. You will find a row of navigations to move back and forward through the demonstrations, the one labelled COMMENTS is the page comments link.
Most of my demonstrations can be used without asking for permission. However, some will require email approval first. Just check each page for the copyright requirements before use.
A list of the recommended DTDs can be found at the following link: Recommended DTDs to use in your Web document.
If you are having problems with your menu dropping down over a flash object then an answer can be found here FAQ: Navigation (flyout) menus are covered up by other things on the page
Switch on quirks mode by using <?xml version="1.0" encoding="UTF-8"?> which will leave quirks mode on in IE5.x and IE6 but use standards compliant mode for IE7.
If you are using php to generate your page then it sees <?xml version="1.0" encoding="UTF-8"?> as php and generates a parse error.
Use <?php echo '<?xml version="1.0" encoding="UTF-8"?>'; ?> instead.
If there is a tutorial for a particular demonstration then the 'TUTORIAL' link under the main menu at the top of the page will be selectable.
I have had many emails asking where the code/style, zip file can be downloaded for the various demonstrations.
Well there is no download facility. The (x)html is always placed in the #info div, so examine the source code, find the <div id="info">.....</div> and in between is the 'code'.
In most case the style is embeded in the page <head>...</head>. This is done to keep it all together on the same page making it easier to find. In some cases the css is held in a separate file (where it should be) and is loaded in the normal way <link rel="stylesheet" media="all" type="text/css" href="path to css file.css" /> so just add this path to the address in your browser to see the css file.
You are probably running a standalone version of IE6 on the same PC as IE7. If this is the case then IE6 will think that it is IE7 as far as the conditional comments are concerned. Because of this IE6 gets the IE7 specific code instead of the IE6 specific code and will not be able to show the sub levels. You will need to test this on a PC that is not running IE7.
IE8 is very temperamental when it comes to multi-level demonstrations and menus (not just mine). I will be going through my demonstrations over the coming months to get them to work in IE8 but in the mean time the easiest way is to switch IE8 into IE7 emulation mode which will cures all problems.
To do this add the following meta tag immediately afer the <head> tag:
<head>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
A simple question and answer that is used to toggle the answers when clicking the questions.
This is generally seen using jQuery/javascript, but this version uses only CSS and works in all modern browsers and operating sysytems.
IE9 will see an instant display of the answers, whereas all other browsers will see the answers slide down into view.
Because of all the time and effort spent in producing this demonstration I would ask that you respect my copyright.
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.
