Fondo transparente div principal pero no afecta a la transparencia Div hijo

some stuff, images etc
.container{ background-color:#333; }

Lo que me gustaría es que el .container div tenga una opacidad del 80%, pero el contenido de .site_content esté al 100%

Establecer la opacidad de css afecta a todos los elementos secundarios. ¿Hay alguna manera de hacer esto? Con jQuery?

Debido a cómo se usará esto, preferiría evitar la técnica de colocar otra div transparente detrás para lograr el efecto.

Necesita usar la propiedad de fondo RGBA en el contenedor div. background: rgba(64, 64, 64, 0.5) . 64, 64, 64 son los valores de color RGB. y 0.5 es el valor de opacidad. Ahora el padre puede tener su propio valor de opacidad que no afecte a los niños. Esto es totalmente compatible con Firefox, Opera, Chrome, Safari e IE9.

Ver ejemplo de trabajo en http://jsfiddle.net/Rp5BN/

Para admitir IE 5.5 a 8, necesitamos usar un filtro de gradiente de CSS específico del proveedor: ‘Entonces debe agregar esto.

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f404040, endColorstr=#7f404040);

Donde 7f representa 127, es decir, 50% de opacidad y 404040 es el color.

Ver ejemplo de trabajo en IE http://jsfiddle.net/Rp5BN/2/

La solución más razonable es:

 .alpha60 { /* Fallback for web browsers that doesn't support RGBa */ background: rgb(0, 0, 0); /* RGBa with 0.6 opacity */ background: rgba(0, 0, 0, 0.6); /* For IE 5.5 to 7*/ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000); /* For IE 8*/ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)"; }