Seleccionar primera tabla de 3 (no va)

fekula · #1 (**permalink**) 10/11/2011, 05:30

Hola a todos.

Quiero pintar el td de la primera tabla de rojo. No hay problema, lo hago con table:first-child tr td

El problema viene cuando hay un <a href="#"></a> encima de las tablas, ya que el código CSS me deja de funcionar. Si comento  ya funciona. No le encuentro el sentido a esto. ¿Alguna idea?

Código HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" lang="es" xml:lang="es">
<head>
<style>

table:first-child tr td {
	background: red;
}

</style>
</head>
<body>

<a href="#"></a>

<table><tr><td>HOLA</td></tr></table>
<table><tr><td>HOLA</td></tr></table>
<table><tr><td>HOLA</td></tr></table>

</body>
</html>

Muchas gracias.

IsaBelM · #2 (**permalink**) 10/11/2011, 06:10

según la estructura que muestras

Cita:

table:nth-child(2) tr td

el número indica la posición de la tabla en el árbol

fekula · #3 (**permalink**) 10/11/2011, 06:28

Con

Código HTML:

table:nth-child(2) tr td

si que me funciona, muchas gracias.

¿De todos modos, creo que Internet Explorer no soporta todavía esa instrucción, no?
http://reference.sitepoint.com/css/pseudoclass-nthchild

IsaBelM · #4 (**permalink**) 10/11/2011, 06:32

ie8- no, por que es un selector css3