I’m not seeing that behaviour in the code you presented. All browsers are showing a 10px margin at the bottom.
Your drawing is showing IE6/7 with round corners but border-radius is only supported in IE9 so you must have additional code for the corners which is probably the issue. However without full code and CSS (or a link) it will be hard to make a diagnosis.
Generally though its a very bad idea to set a height on your container unless it holds something like a fixed height image only. If the container holds text-content then let content dictate the height and not the css. If you are using the height to make equal columns then you will need other methods such as “faux columns”.
Also note that is of no use to have these two styles in the same rule when they have the same units.
You have an empty element at the bottom of that section (#footer) which takes up space in IE7 and under as they always render an element to at least the current font-size/line-height (when is haslayout mode). If you are not using that element for anything then remove it. If you are using it for clearing then there are better methods than using an empty element (such as overflow:hidden on the parent container - see css faq on floats for more info).
Alternatively you could set the height to zero and hide the overflow and the footer will collapse to nothing. However its best to remove it if its not needed.
You should also look at removing the height from your containers as that 1000px looks a little silly.