problema prioridad de cascada

Ipanema85 · #1 (**permalink**) 20/06/2012, 04:17

Hola!

Llevo bastante tiempo leyendo sobre las prioridades en cuanto a la cascada de CSS.

Estoy haciendo un ejercicio y no hay manera. Mi página tiene un fondo con una imagen y estoy intentando poner una div PA con un título dentro, una imagen (a su vez dentro de otra div) y un párrafo. Quiero ponerle transparencia a toda la div PA menos a la imagen que está dentro de la otra div, pero no puedo. He probado todo..hasta ponerle !important y nada. Alguién sabe en que estoy fallando?

kseso? · #2 (**permalink**) 20/06/2012, 06:01

En este caso no es cascada. Es herencia. + info

Sobre su caso, opacity y su herencia, ya se ha explicado muchas veces, tanto el porqué como las vías de impedirlo:
1

vc_rodri · #3 (**permalink**) 20/06/2012, 06:15

Lo resolvi aplicando clases

Index.html

Código:

<!DOCTYPE HTML>
<html lang="es-ES">
	<head>
		<title>Temas Informaticos</title>
		<meta charset="UTF-8">
		<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
	</head>

	<body background="imagen1.jpg">
		<div class="espacio">
			<div class="no_opaco"><img id="imagen" src="imagen2.jpg" width="278" height="181" /></div>
			<div class="opaco">
				<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus.</p>
			</div>
		</div>
	</body>
</html>

style.css

Código:

.espacio{
	height:928px;
	right:983px;
	position: absolute;
	top:27px;
	width:279px;
}

.espacio .opaco
{
	background-color: #FFFFFF;
	filter:alpha(opacity=50);
	height:100%;
	opacity: 0.5;
	padding-top: 181px;
	width:100%;
	-moz-opacity: 0.5;
}

.no_opaco 
{
	position: absolute;
	z-index:1;
}

Espero que te ayude.