Full-height HTML divs

I keep forgetting the right way to make a DIV take up the full height of the web browser. For, say, a full screen map. Chrome and Safari default to filling the whole container but Firefox prefers to calculate a minimum height div. Long story short, here’s what to do:

html, body, div#map { height: 100% }

I’m not entirely sure this is correct but it seems to work and is in line with advice on this StackOverflow discussion. It’s not enough to set the div’s height, you have to set the containers too. There’s also something about using min-height instead but it seems unnecessary. What I don’t know is how to set the height of a div to be 100% minus 100px or the like; something that leaves room for a header or footer.