http://ghetto.adsl.abo.fi:8080/showcase/css-floatest.html

Problemet gäller närmast den stora skillnaden mellan hur firefox och IE visar den, (i standard mode)

alltså, skall floats inuti en div förstora div:en eller inte?

..det jag vill åstadkomma är ungefär så som IE renderar sidan, så att float:arna kommer ovanför border-bottom på den omslutande div:en.

Hur åstadkommer jag detta så att det ser vettigt ut i båda (alla) browsrarna..?

ang vem som har rätt så är det ganska klart: http://www.w3.org/TR/REC-CSS2/visuren.html#propdef-float dvs, firefox är mer standardenlig.

Nu är då frågan, hur ska jag "emulera" IE:s rendering på ett standardenligt sätt?

Varför inte vända på det och emulera Geckos rendering?
Pröva IE7: http://dean.edwards.name/IE7/

i och för sej kunde det eventuellt funka men kom på en bättre lösning som verkar funka, nämligen:

en css regel som sätter in extra (osynligt) innehåll sist i den omslutande diven, detta tvingar alltså ut storleken på den omslutande div:en.

#head:after {
content:"dummy content";
visibility:hidden;
}


Där är för övrigt en bra artikel som diskuterar problemet, den nämner dock inte lösningen ovan.

http://www.complexspiral.com/publications/containing-floats/

Det skall vara två kolon före after:
<code>
#head::after {
content:"dummy content";
visibility:hidden;
}
</code>
Pseudoklasser (t.ex. :hover) har ett kolon, pseudoelement (t.ex. ::after) har två kolon.

Jag misstänker att du har fel:

http://www.w3.org/TR/REC-CSS2/selector.html#before-and-after

http://www.w3schools.com/css/css_pseudo_elements.asp

http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A//ghetto.adsl.abo.fi%3A8080/showcase/css-floatest.html

Jag har inte fel, men jag har kanske litet bråttom att anpassa mig till CSS3:
http://www.w3.org/TR/2000/WD-css3-selectors-20001005/

där ser man.. då hade vi rätt båda två, på sätt och vis.. :) (även om css3 inte går att använda ännu på _länge_)