CSS - issue with checkbox labels with html5

With the following HTML and CSS, the check box labels appear fine in IE8 and Firefox 25 when I use the Doctype to transitional (or loose dtd). When I change the Doctype to html5, the check box labels appear fine in IE8, but in Firefox, each check box label is broken between "Checkbox" and the number. What would I change so that the check box labels render correctly for both IE8 and Firefox?

<!-- Check box labels render fine in IE8 and Firefox -->
<!-- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">-->

Add Bouncy effect to part of a image.

I am trying to code a web version of iphone app wobble(http://www.chillifresh.com/) in css and javascript.

I tried HTML5 canvas, but had very bad performance issue.

Now trying css keyframes and transitions, but no improvement in performance. Because I have to load same image more than 200 times at a time to give such bouncy effects by manipulating each pixel.

Is there any other better way to do this.

CSS Layout Generator

Over the weekend I gave the CSS Layout Generator a long overdue update. Over 872,000 templates have been generated since it was first released at the end of 2003. That's a lot of templates, over 100,000 per year. Towards the end of next year it should hit the 1,000,000 mark. For a tool that has been so popular, quietly chugging away in the background, it was looking pretty old. So it was given a fresh face lift. I reorganized the form components to fit together better. Added basic HTML5 support, doctype and tag type selection for the columns.

IE cannot render this HTML5 site

I'm working on this site right here: http://arihordur.com/fimleikar/

I decided to go with HTML5 and since I'm a Mac I couldn't really see what it'd look like in MS Internet Explorer. Then I BrowserShot it, and wow, it is absolutely horrid. Sad( [ http://browsershots.org/http://arihordur.com/fimleikar/ ]

In order to have the footer stay at the bottom I had to do this:

&#60;body&#62; [blue background]
&#60;header&#62;[with 100%]
     &#60;div id="header2"&#62;[with 960, centered]
     &#60;/div&#62;
&#60;/header&#62;

Syndicate content