La estructura actual de la pagina es algo así: <h1>Titulo de página</h1>
<h2>Primer elemento</h2> <img> breve descripción <h2>Segundo elemento</h2> <img> breve descripción <h2>Tercer elemento</h2> <img> breve descripción el <h2> a su vez contiene el enlace Me gusta esa solución que das, con 2 <span>, y me parece perfecta mientras visualmente haga lo mismo y creo que sí Tú juegas con los z-index, ¿sería lo mismo hacerlo con display block/none? Saludos, -- Jairo Ochoa El 15 de abril de 2010 17:06, Ramón Corominas <[email protected]>escribió: > Sí, la validación fallaría porque igualmente el <div> es elemento de > bloque. De todos modos, sigo sin entender por qué usas <h2>, porque > aparentemente no estás encabezando contenidos de ningún tipo (el <h2> > debería encabezar contenidos en el documento donde lo pones, no en el > siguiente). Otra cosa es que puedes poner dos <span> con clases > distintas con display: block; y solaparlos para hacer ese efecto de > ocultamiento/desocultamiento. Más o menos la idea básica sería algo así: > > <div class="roll"> > <a> > <span class="img1"></span><!-- imagen visible por defecto --> > <span class="img2"></span><!-- imagen oculta que se quiere mostrar en el > rollover --> > </a> > </div> > > .img1, .img2 { width: 100%; height: 100%; display: block; position: > absolute; top: 0; left: 0; } > .roll a .img1 { z-index: 0; } > .roll a .img2 { z-index: 1; } > .roll a:hover .img1, .roll a:focus .img1 { z-index: 1; } > .roll a:hover .img2, .roll a:focus .img2 { z-index: 0; } > > De esa manera además cubres el acceso con teclado, que de otro modo no > se activaría si el usuario navega con el tabulador. > > Saludín, > Ramón. > > Jairo Ochoa escribió: > > Aunque la imagen no puede ir dentro del H2 ya que está presente > > antes de que se muestre el H2 y queda debajo, tapada por el > > background/mascara del H2 > > > > _______________________________________________ > Lista de distribución Ovillo > Para escribir a la lista, envia un correo a [email protected] > Puedes modificar tus datos o desuscribirte en la siguiente dirección: > http://lists.ovillo.org/mailman/listinfo/ovillo > _______________________________________________ Lista de distribución Ovillo Para escribir a la lista, envia un correo a [email protected] Puedes modificar tus datos o desuscribirte en la siguiente dirección: http://lists.ovillo.org/mailman/listinfo/ovillo
