
IE 7 Scrollbar issue when using PIE behavior
Problem DescriptionBrowser Version: IE 7 only (or compatibility mode)
Use Case: Box with rounded corners containing a scrollable div
Issue: Cannot scroll using the drag handle
WorkaroundsYou can refactor the contents of the DIV -- some structures give the issue, some do not. This is not really a viable solution, since it would only be temporary. I could fix the issue now, and some other developer might add to what I did and break it again.
Use CaseI am trying to refactor a bunch of portlets (or rounded corner boxes that have a blue header) to use a simple CSS 3 structure and use PIE behavior in IE 7 and 8. The old code used a complicate HTML structure using background images.
I have removed as much unnecessary HTML and CSS from the example code, but originally the portlet contained a table of "combo boxes". A combo box is an input box that functions like a drop down (which has a toggle button which shows a popup onclick showing auto complete suggestions). After updating the portlet HTML (and not touching the content) now in IE 7 the content is no longer scrollable when dragging the scroll handle.
Reproduction StepsSource Code:
https://gist.github.com/1926652Live Example:
http://www.codefactor.net/examples/scrollbarIssue.html(source code should be a perma-link)
(live example will only be active until I no longer require assistance on this issue)
Screen Shot