css based layout "wraps" columns if their width adds up to 100% (or even less)

With the new css layout (see JS2-329) some things suddenly go wrong.
Currently, only 1 column is displayed for the default page. I tested this with Firefox and IE6.
Others have reported the same problem with at least mozilla 1.2.1.
After I compared the emitted html and css before and after this went wrong I found it.

The culprit is the following tigris layout css style:
.portal-layout-column

{ float: left; /** This id the "gutter" setting for columns */ padding-right: 4px; padding-top: 4px; }

This style, combined with multiple columns which width sum up to 100% leads to wrapping of the columns.
It is used in the templates column layout.vm:
<div class="portal-layout-column" style="width:${columnWidth}%;">

I'm going to solve this by moving the above padding in a new portal-layout-gutter style:
.portal-layout-column

{ float: left; }

.portal-layout-column-gutter

{ /** This is the "gutter" setting for columns */ padding-right: 4px; padding-top: 4px; }

and set this style on a new nested div:
<div class="portal-layout-column" style="width:${columnWidth}%;">
<div class="portal-layout-colum-gutter">

Now it works again on Firefox. But, on IE6 the default-page still renders only in one column
That problem though turned out to be an unrelated different bug with the iframe portlet for which I will create a separate issue.