IE9 Rounded corners not clipping #764

Closed
teamdane opened this Issue Aug 10, 2012 · 2 comments

Comments

Projects
None yet
3 participants
@teamdane

Hello,

In IE9 when on a dark background the rounded corners still have a background.

Thanks,

  • Dane
@patrickkettner

This comment has been minimized.

Show comment Hide comment
@patrickkettner

patrickkettner Aug 17, 2012

This is a result of line 26 of chosen.css

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0 );   

The IE filter being used makes the .chzn-container-single .chzn-single break out of the rounded corners.

The filter could be removed and replaced with

background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc5MSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzkxKSIgLz4KPC9zdmc+);

generated from MS's SVG Gradient Background Maker

This would mean that IE6-8 would not get a gradient background though, at least unless someone could get a css hack that works on IE < 9 for filter properties.

I'd be more than happy to put together a pull request if this is something @pfiller is interested in.

This is a result of line 26 of chosen.css

  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee', GradientType=0 );   

The IE filter being used makes the .chzn-container-single .chzn-single break out of the rounded corners.

The filter could be removed and replaced with

background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc5MSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj4KPHN0b3Agc3RvcC1jb2xvcj0iI0ZGRkZGRiIgb2Zmc2V0PSIwIi8+PHN0b3Agc3RvcC1jb2xvcj0iI0VFRUVFRSIgb2Zmc2V0PSIxIi8+CjwvbGluZWFyR3JhZGllbnQ+CjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzkxKSIgLz4KPC9zdmc+);

generated from MS's SVG Gradient Background Maker

This would mean that IE6-8 would not get a gradient background though, at least unless someone could get a css hack that works on IE < 9 for filter properties.

I'd be more than happy to put together a pull request if this is something @pfiller is interested in.

@pfiller

This comment has been minimized.

Show comment Hide comment
@pfiller

pfiller Jul 11, 2013

Contributor

#1320 landed today and it includes some changes to the way CSS is getting used in IE8/9. As far as I can tell, that PR resolves this issue. When I test a dark bg in IE9 with the latest build, everything seems kosher.

Contributor

pfiller commented Jul 11, 2013

#1320 landed today and it includes some changes to the way CSS is getting used in IE8/9. As far as I can tell, that PR resolves this issue. When I test a dark bg in IE9 with the latest build, everything seems kosher.

@pfiller pfiller closed this Jul 11, 2013

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment