En två-kolumn-layout

Tja

En kolumn. margin: 0 auto; - wrapper.

I denna, som child, en header - header.

Ännu ett child, leftColumn, samt ännu ett, rightColumn.

Sist ett child till wrapper, footer.

wrapper- min-height: 100%; (i FF)
leftColumn- float:left; width: ...; padding-bottom: 50px;
rightColumn- float:right; width ...; padding-bottom: 50px;
footer- margin: 0 auto; margin-top:-50px; height: 50px;

Nu vill jag att footern inte ska gå upp för långt om man minskar viewport vertikalt, under eller över mina floatade kolumner som genom att ha varit floatade inte tar upp utrymme.

Då har jag tre val - antingen att sätta "overfloat: auto;" på min wrapper. Detta ser fult ur i IE, då det kommer scrollbars på "wrapper" om man minskar viewport...
http://www.sitepoint.com/blogs/2005/02/26/simple-clearing-of-floats/

Eller att använda en div till:

<div wrapper>
    <div wrapper2>
          <header> osv ...
    </div>
</div>

och använda http://orderedlist.com/articles/clearing-floats-fne/ det vill säga att floata wrapper2 fast ha den till 100% width. Detta borde funka i IE, har inte testat.

eller att använda http://www.positioniseverything.net/easyclearing.html och lägga klassen "clearfix" på min wrapper. Detta funkar så vitt jag vet i IE.

För grejen är ju att jag vill ha mer än en kolumn (och om man inte floatar båda kolumner utan bara använder margin på den ena, så kommer IE att ha problem med ett par pixlar) och en footer som går in över wrapper.

Hur hade ni löst det?
Lägger ni också padding i era kolumner för att göra plats för footern?