How to Deal With CSS Opacity in Internet Explorer (IE)

You can use Cascading Style Sheets (CSS) to set the opacity of an image or section of a Web page. The Internet Explorer Web browser does not recognize the CSS standard syntax for opacity. You must use a special syntax for IE if you want the image or section to look transparent. You can use the IE syntax alone, if you only want the transparency to be visible in Internet Explorer. You can also use the IE syntax along with the CSS standard syntax to make the page identical across all browsers.

Instructions

1. Open the HTML document that you want to edit in any text editor.

2. Locate the image or section for which you want to set the opacity.

3. Type "style="filter:alpha(opacity=30)" between the "<" and ">" characters for the element. Use any number between 0 and 100. A lower value makes the image more transparent. For example, to make an image transparent, type:

   <img src="myimage.jpg" width="150" height="113" alt="My transparent image"

   style="filter:alpha(opacity=40)" />

   To make a section transparent, type:

   <div style="filter:alpha(opacity=40)>

   Contents of the Section

   </div>

4. Save and close the HTML document.

5. Open the HTML file in Internet Explorer to view the changes.

References

• W3Schools: CSS Image Opacity/Transparency