Make elements translucent & semi-transparent with CSS – the bulletproof solution to CSS transparency

Take a div of class translucent for example, you can literally make it translucent with the following CSS rules. It’s bulletproof, meaning that all the browsers will render it as you have specified. Enjoy!

div.translucent { /* this class makes a window partially transparent */
    opacity: .5;               /* Standard style for transparency */
    -moz-opacity: .5;          /* Transparency for older Mozillas */
    filter: alpha(opacity=50);  /* Transparency for IE */
}

2 thoughts on “Make elements translucent & semi-transparent with CSS – the bulletproof solution to CSS transparency”

  1. Pingback: Styling File Upload / Select Input Control <input type="file" … /> | Make A Website

  2. Pingback: CSS: Difference between opacity:0, visibility:hidden and display:none | Make A Website

Comments are closed.

Scroll to Top