why does body.scrollHeight automatically increase but not decrease

Question

My iframe.body has a scrollHeight property which I believe is read only I don't understand how it gets set.

When I modify the iframe.body.innerHTML with some larger HTML, I notice the iframe.body.scrollHeight increases. Great! When we set $('#previewWindow').height(iframeDocument.body.scrollHeight) this means that the scrollbar is the right height for the new larger content

However....

When I modify the iframe.body.innerHTML with some smaller HTML, I notice the iframe.body.scrollHeight remains the same. NOT great! When we set $('#previewWindow').height(iframeDocument.body.scrollHeight) and this means that the scrollbar is too long and there's loads of whitespace to scroll to at the bottom of the inner content of the iframe

Why does it increase but not decrease in the same logical way? What would be the best workaround?

Thanks

Outofdoor

Ok I made a workaround, I first set the height to 0 each time, then whatever I put into the innerHTML must be bigger! This all seems a bit strange though. $('#iframe').height(0) – Outofdoor