Table with table-layout:fixed and resizing IE8 vs IE 7 / Chrome

I'm making a timeline view in html but I ran into the following problem:

I've 开发者_开发问答got a table row with 12 cells that represent 12 months, each of the month has a colspan according to the number of days in that month. In the same table there is another row containing days, so it contains 365 cells. The table has a width of 100% and the table layout is fixed. When I resize the table in Internet Explore 8 the month cells all seem to resize equally, however when I resize in Internet Explorer 7 or Chrome, the resizing starts at the first months. Which causes the illusion the months are shorter

I've a screenshot to illustrate the problem, you can see the months august till January are smaller then the rest:

Jsfiddle example: http://jsfiddle.net/GZtrx/

I there anyway to fix this without using Javascript?

You could try something like this: JsFiddle example which uses a fixed % width instead of colspan.

A few thoughts:

How about going old school and using a transparent 1x1 px gif, and using .CSS to style the width of the gif?

Transparent gif as a cell bg.

min-width in the .CSS