Conditional Comments for IE8


(Meghan) #1

I want to use a button with a border-radius, that fades in. However, in IE8, there is no opacity change for elements with a border-radius. I’ve tried unsuccessfully to do this by putting the conditional statement in the Hype document head and attaching a class to the rounded button.

I’m wondering if anyone has had success using conditional comments to target IE8 and remove the border-radius?


(Jonathan Deutsch) #2

You might have better luck going the reverse direction - in Hype itself do not add a border radius, and then in your CSS make the class set a border radius on the element:

<style>	
.hasRadius {
	border-radius: 20px !important;
}	
</style>

I didn’t need to wrap in the conditionals; for some reason it seems the PIE.htc (library we use to add some IE effects) did not pick this up and try to put a border radius on the element. Definitely test to make sure this holds true for you. Also note that you may need the “!important” directive.