"non-opacity" border for "opacity" element
css, html
Solution
There isn't a `non-opacity` attribute but what you can do is set the background colour of that div with RGBA. This allows you to specify an opacity essentially, but just for the background (so it won't affect the border)
background: rgba(0, 255, 0, 0.4);
This will achieve what you want, a red border with that transparent looking background. Demo HERE. This won't however, make inner content, such as images or text transparent. Though you can set the opacity on those elements freely without worrying about the border of the parent.
You can find a good article that details the difference between opacity and RGBA here and here
It should be noted that, as expected, IE8 and below do not support RGBA, though it can be "hacked" with CSS3 PIE.
Problem
Given this html ``` <div id="my_div"> </div> ``` css ``` #my_div { width: 100px; height: 100px; background-color: #0f0; opacity: 0.4; border: 3px solid #ff0000; } ``` I want that own div tag will `opacity`, but dont need border also. css can make "non-opacity" border for "opacity" element?