Foros del Web - Ver Mensaje Individual - Tengo un problema en CSS y HTML, selectores

Andrewone · #1 (**permalink**) 10/01/2014, 17:33

Bueno, pues mi problema consiste en que tengo ciertos div con opacidad = 0 y en determinado momento deseo cambiar la propiedad de opacidad por 1, al inicio todo funcionaba bien, hasta que agregué el div pestanas. La estructura es la siguiente:

HTML:

Código HTML:

Ver original<body>
     <div id="contenedor">
         <div id="pestanas">
                <input id="tab1" type="radio" name="tab-group" checked />
                <label for="tab1"><img src="Images/escribir16.png">...</label>
                <input id="tab2" type="radio" name="tab-group" />
                <label for="tab2"><img src="Images/codigo16.png">...</label>
                <input id="tab3" type="radio" name="tab-group" />
                <label for="tab3"><img src="Images/alumno16.png">...</label>
            </div>
            <div id="contenido">
                <div id="cont1">
                    <p class="left"><img src="Images/escribir48.png" alt=""> ...</p>
                </div>
                <div id="cont2">
                    <p><img src="Images/codigo48.png" alt="">...</p>
                </div>
                <div id="cont3">
                   <p><img src="Images/alumno48.png" alt="">...</p>
                </div>
            </div>
        </div>
</body>

Y estoy intentando cambiar la opacidad desde el CSS:

Código CSS:

Ver original#pestanas input#tab1:checked ~ #contenido #cont1, 
#pestanas input#tab2:checked ~ #contenido #cont2,
#pestanas input#tab3:checked ~ #contenido #cont3{
    opacity: 1;
    z-index: 100;
}

Sinceramente soy nuevo en esto como desde hace tres días y no se muy bien como acceder.