Voy a probar. 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
El H2 lo utilizo porque el H1 da título a la página y los H2 son los enlaces a las páginas relacionadas. Otra opción que se me ocurre es contener todo un <div> y reemplazar el <span> por un <h2> ¿Cometería el mismo fallo de validación si el <a> encierra el <div> y este a su vez al <h2>? Saludos -- Jairo Ochoa El 15 de abril de 2010 13:05, Ramón Corominas <[email protected]>escribió: > Yo me preguntaría... ¿Es realmente necesario que ese título sea un <h2>? > Tal como lo veo a lo mejor es más práctico que pongas un simple <span>. > Otra opción, si realmente es un <h2> que encabeza algo más que la > imagen, podría ser meter dentro del <h2> el enlace y que incluya tanto > al título como a la imagen. Y a ser posible un solo enlace, porque si no > eso puede ser repetitivo para el usuario de lector de pantalla. Y por > cierto, a la imagen le deberías poner un texto alternativo con el > atributo alt. > > Algo así, tal vez (suponiendo que hay contenido detrás, si no lo suyo > sería no poner <h2>): > > <div ...> > <h2><a href="..."> > <span class="txt">Mi título</span> > <span class="img"><img src="..." alt="..." /></span> > </a></h2> > ... otros contenidos a los que da título el <h2> > </div> > > Saludos, > Ramón. > > Jairo escribió: > > Lo he probado también, pero al estar h2 sobre la imagen, la 'tapa' y el > > enlace que hay debajo no funciona. > > > > h2 tiene un width y height del mismo tamaño que la imagen para que así el > > png que es background de h2 deje ver la imagen con transparencia. > > > > :-( > > > > > > -- > > > > Jairo Ochoa > > > > > > El 15 de abril de 2010 12:51, Carlos Acero Sánchez < > > [email protected]> escribió: > > > > > >> Enlaza el link que le pones a la imagen y ya está. > >> > >> <div class="post"> > >> <h2><a href="mipagina.html"><span>Mi titulo</span></a></h2> > >> <a href="mipagina.html"><img class="thumbnail" src="imagen.jpg" /></a> > >> </div> > >> > >> Carlos Acero Sánchez > >> Dpto. Sistemas > >> Aguirre Newman > >> > >> -----Mensaje original----- > >> De: [email protected] [mailto: > >> [email protected]] En nombre de Jairo Ochoa > >> Enviado el: jueves, 15 de abril de 2010 12:26 > >> Para: Ovillo, la lista de CSS en castellano > >> Asunto: [Correo sospechoso] Re: [Ovillo] Mostrar capa sobre imagenes al > >> hacer mouseover > >> > >> Hola, > >> > >> Te refieres a validación W3C? > >> > >> Tal cual está funciona en todos los navegadores > >> - Mac OS: Firefox, Camino, Chrome, Safari, Opera, SeaMonkey y Netscape > >> - Windows XP: Firefox > >> - Windows 7: Firefox, Explorer 8 > >> > >> Y falla en: > >> - Windows XP: Explorer 6 > >> > >> Todas las capas las muestra sobre el primer elemento. En pantalla se > >> muestra > >> un grid de 5x3 elemetos .post > >> Supongo que el error se debe a los valores de css "position" > >> > >> Ahora, he hecho el cambio que sugieres > >> > >> <div class="post"> > >> <h2><a href="enlace"><span>Mi titulo</span></a></h2> > >> <a href="enlace"><img class="thumbnail" src="imagen.jpg" /></a> > >> </div> > >> > >> En el css, cambio lo que comentaron en el anterior email por esto > >> > >> .post:hover h2 { display:block; } > >> > >> > >> Estéticamente el efecto es el mismo salvo que la zona de enlace se > >> restringe > >> sólo a al texto. > >> > >> Es decir, si antes daba igual donde hiceiese click, porque siempre se > abría > >> la página, ahora sólo funciona si hago click sobre las letras del > título. > >> > >> > >> ¿Qué alternativa sugieres que valide y que funcione de igual forma? > >> > >> > >> > >> Saludos, > >> > >> -- > >> > >> Jairo Ochoa > >> > >> > >> El 15 de abril de 2010 09:39, Ramón Corominas > >> <[email protected]>escribió: > >> > >> > >>> Nota: > >>> > >>> <h2> es elemento de bloque. > >>> <a> es elemento inline > >>> > >>> <h2> no puede ir dentro de <a> si quieres que el código valide. > >>> > >>> Saludos, > >>> Ramón. > >>> > >>> Jairo escribió: > >>> > >>>>>> Tengo este codigo html (que puedo cambiar si fuese necesario) > >>>>>> > >>>>>> <div class="post"> > >>>>>> <a href="enlace.php"> > >>>>>> <h2><span>mi titulo</span></h2> > >>>>>> <img class="thumbnail" src="imagen.jpg" /> > >>>>>> </a> > >>>>>> </div> > >>>>>> > >>>>>> > >>> _______________________________________________ > >>> 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 > >> > >> En cumplimiento de la Ley 15/1999, de 13 de diciembre, de Protección de > >> Datos de Carácter Personal, le informamos que los datos de carácter > personal > >> utilizados para la presente comunicación proceden de un fichero de datos > de > >> carácter personal titularidad de Aguirre Newman, S.A., debidamente > >> notificado ante la Agencia Española de Protección de Datos, cuya > finalidad > >> es la gestión (control, mantenimiento y archivo de la documentación) de > la > >> relación que mantiene con el GRUPO AGUIRRE NEWMAN y la comunicación con > >> terceros. Dichos datos, por consiguiente, han sido incorporados o serán > >> incorporados en dicho fichero para los usos y finalidades indicadas, > >> pudiendo ser objeto de comunicación a las Compañías que integran el > GRUPO > >> AGUIRRE NEWMAN, cuya identidad podrá consultar en el aviso legal de la > >> página web corporativa www.aguirrenewman.es, cuando sea necesario y/o > >> pertinente para el cumplimiento de las finalidades señaladas. > >> Si Ud. no consintiese la utilización del correo electrónico para > enviarle > >> comunicaciones electrónicas, la comunicación de sus datos de contacto > al > >> resto de empresas del GRUPO AGUIRRE NEWMAN o deseara revocar su > >> consentimiento al tratamiento de sus datos, podrá hacerlo mediante un > correo > >> electrónico dirigido a [email protected]. Asimismo, si > Ud. > >> desea ejercitar sus derechos de acceso, rectificación, cancelación y > >> oposición podrá hacerlo dirigiéndose por escrito al Departamento de > Asesoría > >> Jurídica de Aguirre Newman, S.A., calle General Lacy número 23, C.P. > 28045 > >> Madrid, remitiendo, junto con la solicitud, una fotocopia de un > documento > >> oficial de identificación (DNI, Pasaporte, etc). > >> > >> > ____________________________________________________________________________ > >> > >> According to Spanish Data Protection Law 15/1999, we hereby inform that > the > >> personal data used in this communication come from an automated data > filed > >> owned by Aguirre Newman, S.A., which has been duly notified to the > Spanish > >> Data Protection Agency, and whose purpose is managing (control, > maintenance > >> and archiving) the relationship you hold with GRUPO AGUIRRE NEWMAN and > its > >> communication with third parties. Such personal data has been included > >> within the referred data file for the uses and purposes above-mentioned > and > >> may be transferred to other companies of the AGUIRRE NEWMAN Group, when > >> necessary for the compliance of the purposes above-mentioned. The > companies > >> that form the AGUIRRE NEWMAN GROUP are listed in the legal notice of the > >> corporate web site www.aguirrenewman.es. > >> If you do not consent the use of you e-mail for sending electronic > >> communications, or transferring your personal data to the companies of > the > >> AGUIRRE NEWMAN Group, or you want to revoke your consent, please send an > >> e-mail to [email protected]. In addition, if you want > to > >> exercise your rights of access, rectification, cancellation and/or > >> opposition, please send a written request to the Legal Department of > Aguirre > >> Newman, S.A. c/ General Lacy Nº 23, PO. BOX 28045 Madrid, attaching a > >> photocopy of an official identification document (DNI, Passport, etc). > >> > >> > >> _______________________________________________ > >> 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 > > > > _______________________________________________ > 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
