error al validar mi código

john_peretrucci · #1 (**permalink**) 03/04/2011, 12:45

Buenas a todos!

Al validar mi código me sale el siguiente error:

Line 28, Column 178: document type does not allow element "div" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag

…EAADC';"
onmouseout="document.getElementById('texto1').styl e.color='#ffffff';">

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

Os adjunto el código(sin poner los "heads", "bodys", etc):

<a href="diseno-grafico.html">
<div class="apartados_home_elemento" onmouseover="document.getElementById('texto1').sty le.color='#2EAADC';" onmouseout="document.getElementById('texto1').styl e.color='#ffffff';">
<img border="0" src="img/portada-grafico.jpg" alt="portada diseño grafico" />
<table class="tabla">
<tr>
<td><img src="img/icono-grafico.jpg" alt="icono diseño grafico" /></td>
<td id='texto1' class="elemento_texto1"><strong>Diseño gráfico</strong></td>
</tr>
</table>
</div>
</a>

¿Me podéis ayudar a encontrar el error?

Muchas gracias!

JavierB · #2 (**permalink**) 03/04/2011, 12:49

Hola john_peretrucci

No puedes poner un div y una tabla dentro de un enlace.

Saludos,

john_peretrucci · #3 (**permalink**) 03/04/2011, 13:00

Muchas gracias por responderme con tanta rapidez JavierB!

Sí, eso es lo que yo he visto, pero mira, te adjunto un código igual en el cual si que lo valida:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<style type="text/css">
#caja-link{
position:relative;
padding-bottom:20px;
width:200px;
overflow:hidden;
}
#caja-link a{
color:black;
position:absolute;
left:0;
top:0;
width:200px;
height:20px;
text-align:center;
padding-top:200px;
line-height:20px;
}
#caja-link a:hover{
color:yellow;
}
</style>
</head>
<body>

<a href="diseno-grafico.html">
<div class="apartados_home_elemento" onmouseover="document.getElementById('texto').styl e.color='#2EAADC';" onmouseout="document.getElementById('texto').style .color='#ffffff';">
<img src="img/portada-grafico.jpg" alt="portada diseo grafico" />
<table class="tabla">
<tr>
<td><img src="img/icono-grafico.jpg" alt="icono diseo grafico" /></td>
<td id='texto' class="elemento_texto1"><strong>Diseo grfico</strong></td>
</tr>
</table>
</div>
</a>
</body>
</html>

¿Por qué en este html sí que lo valida y en el mio no?

Gracias!

Daniel Ulczyk · #4 (**permalink**) 04/04/2011, 15:31

Tema movido desde el foro de Accesibilidad Web

kseso? · #5 (**permalink**) 05/04/2011, 12:02

El hecho de que sea válida o no una práctica es función única y exclusivamente del doctype declarado.

Como en el primer caso (#1) no facilita ese dato, cabe suponer que es distinto al de #3.

GatoGordo · #6 (**permalink**) 05/04/2011, 17:26

Coincido, depende del doctype.

Saludos!