SuzyUK - 9:54 pm on Mar 19, 2011 (gmt 0)

Quick look around says it's one of those x-browser differences that occur because the specs aren't clear, it is only IE8 (and you say 9 too), 7 is "ok" though previously I think Safari 3 also treated it like IE8 as did a Gecko, there may be others.

I found a complex solution involving an absolutely positioned div.. but I think to keep it simple and stable and working in all browsers regardless of their mood, lol, is to simply nest a div in the scrolling one and put the padding on the nested div, not too bad a solution as the height/width can then be more accurately controlled on the scrolling div. Apparently, though I haven't measured this, the bottom padding (and right padding can be affected too actually) that does get rendered on an overflowing div is not always the same amount x-browser or versions either so this way is likely a good fallback for a while.. that's my thoughts anyway

a summary:

HTML: <div id="scroll"><div> .. loads of content.. </div></div> CSS: #scroll { width: 400px; height: 600px; overflow:auto; } #scroll > div { padding: 100px 40px; }