Comunidad de diseño web y desarrollo en internet online

esta bien este css y este html?

Citar            
MensajeEscrito el 13 Sep 2006 02:04 pm
Qué tal, me acabo de iniciar un poco en este mundillo y quería ver si está bien escrito el código de ambos archivos o si en cambio hay salvedades que hacerle? Si es así por favor, podríais comentarme porqué está mal hecho así? también comentaros que dentro de un div utilizo una tabla para colocar unos elementos...como podría hacer esto para evitar tablas?

son dos archivos html que apuntan a un mismo css...


muchas gracias por echarme una mano!! y corregirme en todo lo que veáis oportuno!

gracias por todo!!
Un saludo

lagarto

Por dsign

1 de clabLevel



Genero:Masculino  



Ultima edición por dsign el 14 Sep 2006 07:23 am, editado 1 vez

msie
Citar            
MensajeEscrito el 13 Sep 2006 04:22 pm
Intenta primero validarlo en w3c:

http://validator.w3.org/ //para HTML

http://jigsaw.w3.org/css-validator/ //para CSS

Ahi te saldran los errores y las posibles soluciones.
Luego puedes postear el code, pero no ponerlo para descargar, publicalo directamente usando la etiqueta [ code ]

Saludos

Por Ramm

BOFH

3152 de clabLevel

6 tutoriales
8 articulos

Genero:Masculino   Bastard Operators From Hell REC Héroes

London, UK

firefox
Citar            
MensajeEscrito el 14 Sep 2006 08:12 am
Estos son los mensajes de error del htm:

This page is not Valid XHTML 1.0 Transitional! :o
Failed validation, 6 errors

1- Error Line 29 column 68: document type does not allow element "td" here.
2- Error Line 30 column 53: document type does not allow element "td" here.
3- Error Line 32 column 12: end tag for "td" omitted, but OMITTAG NO was specified.

4- Info Line 26 column 10: start tag was here.
5- Error Line 81 column 95: there is no attribute "wrap".
6- Error Line 87 column 532: end tag for "br" omitted, but OMITTAG NO was specified.

7- Info Line 87 column 528: start tag was here.
8- Error Line 88 column 180: end tag for "br" omitted, but OMITTAG NO was specified.
9- Info Line 88 column 176: start tag was here.

Pero no entiendo muy bien que quiere decir (no me refiero al idioma, sino a la forma de corregirlo), tampoco sé que doctype usar...

Ayudaría muchísimo si me diéseis una breve explicación por cada error y posible solución. :crap:

este es el html:

Código :

<!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">
<head>
<title>Adhesiones M&aacute;laga 2016</title>

<link href="estilo.css" rel="stylesheet" type="text/css" />


</head>

<body>

<div id="contenedor">
   <div id="cabecera"> </div>

   <div id="contenido"> 
   
      <div id="interno">
         <form method="post" action="#">
            <table width="100%" 
         border="0" 
         cellpadding="0" 
         cellspacing="0">
        <tr>
          <td width="14%" class="titulo"><a href="#"></a>
           <a href="#"><img src="images/btn_volver.gif" alt="bot&oacute;n volver" width="84" 
         height="15" border="0" align="top" /></a>
          <td width="21%" height="20" valign="middle" class="titulo">Tipo de adhesi&oacute;n* </td>
          <td width="65%" valign="top" class="titulo">
            <input name="tipo" type="text" class="formularios" id="tipo" size="15" />          </td>
        </tr>
        <tr>
          <td class="titulo"><div align="left"><a href="#"><img src="images/btn_veradhesiones.gif" alt="boton ver adhesiones" width="84" height="15" border="0" align="top" /></a></div></td>
          <td height="20" valign="middle" class="titulo">Nombre*</td>
          <td valign="top" class="titulo"><input name="nombre" type="text" class="formularios" id="nombre" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Apellidos*</td>
          <td valign="top" class="titulo"><input name="apellidos" type="text" class="formularios" id="apellidos" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">NIF/CIF*</td>
          <td valign="top" class="titulo"><input name="nif" type="text" class="formularios" id="nif" size="15" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Direcci&oacute;n*</td>
          <td valign="top" class="titulo"><input name="direccion" type="text" class="formularios" id="direccion" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">C&oacute;digo postal* </td>
          <td valign="top" class="titulo"><input name="cp" type="text" class="formularios" id="cp" size="15" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Localidad*</td>
          <td valign="top" class="titulo"><input name="localidad" type="text" class="formularios" id="localidad" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Pa&iacute;s</td>
          <td valign="top" class="titulo"><input name="pais" type="text" class="formularios" id="pais" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Correo electr&oacute;nico </td>
          <td valign="top" class="titulo"><input name="correo" type="text" class="formularios" id="correo" size="75" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="middle" class="titulo">Tel&eacute;fono</td>
          <td valign="top" class="titulo"><input name="telefono" type="text" class="formularios" id="telefono" size="15" /></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td height="20" valign="top" class="titulo">Comentarios          </td>
          <td valign="top" class="titulo"><textarea name="comentarios" cols="74" rows="4" wrap="physical" class="formularios" id="comentarios"></textarea></td>
        </tr>
        <tr>
          <td>&nbsp;</td>
          <td valign="top"><div class="mensaje">*Datos obligatorios </div>            <a href="#"><img src="images/btn_enviar.gif" alt="bot&oacute;n enviar" width="73" height="19" border="0" /></a></td>
          <td valign="top"><div class="txt_azul">
            <p>En cumplimiento de la Ley Org&aacute;nica 15/1999, de 13 de diciembre,   de Protecci&oacute;n de Datos de Car&aacute;cter Personal se informa que los datos personales   que se solicitan van a ser incorporados a un fichero automatizado y tratados con   la exclusiva finalidad de su participaci&oacute;n en los procesos de adhesi&oacute;n a M&aacute;laga   Ciudad Europea de la Cultura 2016, siendo el responsable del fichero y de su   tratamiento el &Aacute;rea de Cultura del Excmo. Ayuntamiento de M&aacute;laga.<br>
              Los datos   ser&aacute;n tratados con absoluta confidencialidad, no siendo accesibles por terceros   para finalidades distintas para las que han sido facilitados.<br>
              El titular de   los datos tiene reconocidos los derechos de acceso, rectificaci&oacute;n, oposici&oacute;n y   cancelaci&oacute;n de los mismos, los cuales podr&aacute;n ser ejercitados mediante el env&iacute;o   de correo electr&oacute;nico a la direcci&oacute;n.</p>
          </div></td>
        </tr>
      </table>
   </form> 
   </div>
   </div>
   <div id="pie"> </div>
</div>
</body>
</html>


el css a parecer valida bien según la w3c, solo tiene advertencias. ^^

Este es el css:

Código :

body {
   text-align:center;
   background-color:#0558A3;
   margin: 0;
   padding:0;
   }

#contenedor {
   width: 800px;
   height: 585px;
   padding: 0px;
   margin: 0 auto;
   text-align:left;
   clear: both;
}

#cabecera {
   margin: 0px;
   padding: 0px;
   width: 800px;
   height: 161px;
   background-image:url(images/cabecera.gif);
   background-position: top;

}

#contenido {
   margin:0 auto;
   padding-top: 10px;
   width: 800px;
   height:387px;
   background-image:url(images/contenido.gif);
   background-position:top;
   text-align:center;

}

#interno {
   width: 710px;
   margin:0 auto;
   
}

#pie {
   margin: 0px;
   padding: 0px;
   width: 800px;
   height: 27px;
   background-image:url(images/pie.gif);
   background-position:top;

}

.titulo {
   text-align:left;
   font-size: 11px;
   font-weight:bold;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   color:#666666;
}

.formularios {
   text-align:left;
   font-size: 11px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   background-color:#FFFFFF;
   color:#003366;
   border: #0066CC;
   border-style:solid;
   border-width: 1px;
   }

.mensaje {
   font-size: 9px;
   font-weight: bold;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:left;
   margin:5px;
}
.txt_azul {
   margin-top: 8px;
   font-size: 8px;
   color:#0066CC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:justify;
   text-decoration: none;
   }
.txt_azul a:link{
   font-size: 8px;
   color:#0066CC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-decoration: none;
   }
   
   .txt_azul a:hover{
   margin-top: 8px;
   font-size: 8px;
   color:#0066CC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:justify;
   text-decoration: none;
   }

   .txt_azul a:visited{
   margin-top: 8px;
   font-size: 8px;
   color:#0066CC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:justify;
   text-decoration: none;
   }
   
.txt_azul a:active{
   margin-top: 8px;
   font-size: 8px;
   color:#0066CC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:justify;
   text-decoration: none;
   }

   
/* PAGINA LISTADO ADHESIONES*/

.cabeceras {
   color:#0558A3;
   font-weight: bold;
   font-size: 9px;
   text-align:center;
   vertical-align:middle;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   margin:2px;
}
.pie_tabla {
   color:#0558A3;
   font-weight: bold;
   font-size: 12px;
   text-align:left;
   font-family:Verdana, Arial, Helvetica, sans-serif;   
   vertical-align:middle;
   margin:2px;
}
a:link {
   color: #0558A3;
   font-size: 12px;
   font-family:Verdana, Arial, Helvetica, sans-serif;   
   text-decoration: none;
}
a:visited {
   color: #0558A3;
   font-size: 12px;
   font-family:Verdana, Arial, Helvetica, sans-serif;      
   text-decoration: none;
}
a:hover {
   color: #0558A3;
   font-size: 12px;
   font-family:Verdana, Arial, Helvetica, sans-serif;      
   text-decoration: underline;
}
a:active {
   color: #0558A3;
   font-size: 12px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-decoration: none;
   font-weight: bold;
}

.lista {
   font-size: 9px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   text-align:left;
   margin:5px;}
   
.txt_der {
   text-align:right;
   font-size: 12px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
}
.txt_izq {
   text-align:left;
   font-size: 12px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
}


agradezco enormemente vuestra ayuda!!!

Por dsign

1 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 14 Sep 2006 04:32 pm
Ok, tienes algunos detalles

Esto:

Código :

<table width="100%" 
         border="0" 
         cellpadding="0" 
         cellspacing="0">


Juntalo en una sóla línea, te falta cerrar algunos TD, el BR se usa

Código :

<br />


Revisa eso también, sobre el doctype, creo que lo tienes más escrito, usa este:

Código :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Es el que genera dreamweaver y nunca he tenido problemas con ello.

Por Aoyama

BOFH

6224 de clabLevel

6 tutoriales
12 articulos

Genero:Masculino   Anime Bloggers Bastard Operators From Hell

Webdesigner & Developer, en mis ratos libres bebo café por litros.

firefox
Citar            
MensajeEscrito el 18 Sep 2006 06:14 am
o por lo menos ya me valida ahora solo me queda convertir la tabla en tabla-css ( a base de th creo), alguien sabe como hacer esta 'conversión'?

un saludo!

alex

Por dsign

1 de clabLevel



Genero:Masculino  

msie
Citar            
MensajeEscrito el 18 Sep 2006 07:59 am
La conversion no la hagas de etiqueta en etiqueta o moriras joven.
Quiero decir, es mejor que la maquetes desde el principio.
Te he hecho una tabla para que te sirva de ayuda, aunque debes mirar los tutoriales de clab sobre este tema, porque vienen muy bien.
tabla

Saludos.

Por Johnny

Claber

1589 de clabLevel

4 tutoriales

  Héroes

opera

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.