Your Firefox must be set to enlarge text only rather than zoom. Very nice.
Normally, setting a fixed height on something means it won't grow when the content inside does. Ryan is correct that you should generally avoid it.
But the reason it's still not growing is because the text inside is floated. The footer doesn't "see" those floats and so doesn't enclose them (which static block containers normally do to everything inside them). You've heard of clearing divs? this kind of thing is why some people use them.
In Internet Explorer 6 and 7, now that you have min-height instead of height, things should be growing okay with the text because the width: 100% is triggering Haslayout.
For everyone else, you can use one of the common float-enclosing tricks:
You could set #footer to overflow: hidden. So long as the height is min-height, it will still grow with content. Blocks with overflow set to anything other than "visible" (the default) are required to "see" their children so they can determine if there even IS any overflow. This is the solution I use most of the time. Don't use it if content must ever be able to come out of the container.
You could set the #footer to display: inline-block. Since you've stated its width to 100% already, this should look okay, but test it. I found this started breaking my layouts when I did severe text-enlarge on smaller-width screens, but might be okay with you (or you don't deal with smaller screens maybe).
You could set the #footer to display: table. I'm uneasy with this one since tables have their own set of rules they play by and I'm not always expecting what they do.
You could use a fake CSS element to "clear" the floats. Once there's a "child" after the floats who clears them, the footer finally can see its last child and encloses everyone.
After the #footer declaration:
content: " "; (if Firefox doesn't like this, use unicode space \0a inside the quotes, but I've used an empty string before just fine)
display: block; (only blocks clear cross-browser)
clear: both; (you have floats in both directions)
height: 0; (something I add for browsers who use things like font-size/line-height to make a gap)
You could float the footer itself. Floats must contain floats. Since you've set it to 100% width, it shouldn't be able to ride up alongside your main content. I don't like this solution.
Those are the most common of the ones that don't suck.