IE7 - ScrollBar Takes Page Space

When overflow-y is applied.

[inveni0]

Here's my code:

.contentHolder {
height: 595px;
width:auto;
overflow: -moz-scrollbars-vertical;
overflow-x: hidden;
overflow-y: scroll;
}

This creates a problem in IE7 only. Instead of having the scrollbar overlay the DIV, it shifts the DIV and the displays the scrollbar outside of the DIV, which takes up page space and throws alignment out.

Is there a workaround?

[cmarshall]

I'm not sure. I'd have to test. However, I suspect that enclosing this in a <div> that extends to the right, giving some gutter space, might do the trick. It would effectively waste the space for non-IE browsers, but would probably give a predictable layout.

You might also be able use (yech) IE-specific CSS. IE supports some macro stuff that I hate to use, but might work.