Las celdas se mueven de su sitio

Groendal · #1 (**permalink**) 01/11/2006, 03:43

Primero pido disculpas porque este problema lo ha debido de plantear mucha gente, pero no he podido encontarlo.

Desde que empecé a utilizar Dreamweaver MX me di cuenta de que muchas veces al mostrar en el navegador una página, dos celdas que habia puesto pegadas aparecian con cierta separación, o celdas que habia puesto en cierto sitio aparecian más a la derecha o a la izquierda.
Simplemente lo acepté así, suponía que se podria depurar el código fuente o algo así, pero se me hacia una montaña entenderlo. Pero ahora estoy haciendo páginas más en serio y estoy dispuesto a conocer más sobre el código, ¿alguien me podría explicar como solucionar esto?

Me gustaría saber arreglar esto en general, pero si no os imaginais lo que digo puedo poner algún ejemplo.

Muchas gracias
Saludos.

Groendal · #2 (**permalink**) 01/11/2006, 04:02

Mejor pongo el ejemplo directamente :P

trialogos.com/presentacion.htm (esto es con www primero, es que nome deja

poner enlaces)

trialogos.com/convivencia%20escolar.htm (esto es con www primero, es que nome deja

poner enlaces)

Si os fijais, arriba a la derecha hay un logotipo con su anagrama (eso es una imagen en una celda) y bajo está el "subtítulo de la empresa" (convivencia y mediación) (que es un texto en otra celda).
En el editor yo los he puesto juntos en ambos casos, pero al publicarla, en el segudo aparecen con una gran separación... ¿¿porqué???!!!! jaja ¡desesperante! :P

Muchas gracias de nuevo.

valeguz · #3 (**permalink**) 01/11/2006, 09:11

Probaste poniendo una tabla que agrupe ambas celdas?

c0lo · #4 (**permalink**) 01/11/2006, 09:43

Hola, quizá sea este tu problema.

<table cellspacing="0" cellpadding="0">

Probá agregando eso y fijate si se soluciona.
Después jugá con los valores para que veas de que se trata.

Saludosss!!

Groendal · #5 (**permalink**) 02/11/2006, 03:41

Cita:

Iniciado por valeguz

Probaste poniendo una tabla que agrupe ambas celdas?

La verdad es que no, pero como no suele ser necesario, si lo puediera evitar mejor... no son muy manejables para mi las tablas.

Groendal · #6 (**permalink**) 02/11/2006, 03:49

Cita:

Iniciado por c0lo

Hola, quizá sea este tu problema.

<table cellspacing="0" cellpadding="0">

Probá agregando eso y fijate si se soluciona.
Después jugá con los valores para que veas de que se trata.

Saludosss!!

Eso ya está así (<table width="1020" border="0" cellpadding="0" cellspacing="0">) en las dos páginas.

Como dices que lo pruebe? donde debería agregarlo?

La única diferencia que veo es esta:

en la de convivencia escolar (esto para la imagen <td colspan="4" rowspan="2" valign="top">, y esto para el texto <td colspan="4" valign="top">)

y en la de presentación (esto para la imagen <td colspan="2" valign="top"> y esto para el texto <td colspan="2" valign="top">)

Muchas gracias por el interes de todas formas

Groendal · #7 (**permalink**) 02/11/2006, 04:14

Voy a poner aquí las principales diferencias que veo en rojo:

En convivencia escolar:

Código:

<body>
<table width="1020" border="0" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
<td width="4" height="67"></td>
    <td width="71"></td>
    <td width="71">&nbsp;</td>
    <td width="63">&nbsp;</td>
    <td width="45">&nbsp;</td>
    <td width="298">&nbsp;</td>
    <td width="144">&nbsp;</td>
    <td width="146">&nbsp;</td>
    <td colspan="4" rowspan="2" valign="top"><a href="index.htm" target="_parent"><img src="Imagenes/Index/logo2.gif" width="168" height="84" border="0"></a></td>
 <td width="10">&nbsp;</td>
  </tr>
  <tr>
     <td height="17"></td>
     <td></td>
     <td colspan="5" rowspan="3" valign="top"><p class="Estilo6">Convivencia  escolar </p></td>
     <td></td>
     <td></td>
   </tr>
   <tr>
     <td height="16"></td>
     <td></td>
     <td></td>
     <td width="16"></td>
     <td colspan="4" valign="top"><div align="right"><span class="Estilo4">convivencia y mediaci&oacute;n </span></div></td>
  </tr>

Y en la de presentación:

Código:

<table width="1020" border="0" cellpadding="0" cellspacing="0">
  <!--DWLayoutTable-->
  <tr>
    <td width="112" height="84"></td>
    <td width="732"></td>
    <td colspan="2" valign="top"><a href="index.htm" target="_parent"><img src="Imagenes/Index/logo2.gif" width="168" height="84" border="0"></a></td>
    <td width="8">&nbsp;</td>
  </tr>
  <tr>
    <td height="16"></td>
    <td></td>
    <td width="15"></td>
    <td colspan="2" valign="top"><div align="right"><span class="Estilo4">convivencia y mediaci&oacute;n </span></div></td>
  </tr>

jossss · #8 (**permalink**) 02/11/2006, 08:42

Hola Groendal. El problema es que el título de la página (Convivencia escolar) tiene 60 px de alto y además está en la etiqueta <p> con lo cual siempre va a sumar más de los 74 px que debería ocupar su celda. Esto influye a las medidas de las celdas contiguan que pasan a aumentar su tamaño. No se si me he explicado... Yo lo solucionaría con lo siguiente

En vez de

Código PHP:

  <tr> 
     <td height="17"></td> 
     <td></td> 
     <td colspan="5" rowspan="3" valign="top"><p class="Estilo6">Convivencia  escolar </p></td> 
     <td></td> 
     <td></td> 
   </tr>

lo cambiaría por este otro

Código PHP:

  <tr> 
    <td height="17"></td> 
    <td></td> 
    <td height="74" colspan="5" rowspan="3" valign="top" class="Estilo6">Convivencia escolar </td> 
    <td></td> 
    <td></td> 
  </tr>

A ver si esto te soluciona algo.

juaniquillo · #9 (**permalink**) 02/11/2006, 09:47

eso mismo iba a decir yo. Elimina el tag de paragraph. Eso me ha pasado algunas veces en DW. Solo tienes que estar pendiente del codigo y sus cambios.

sx7a · #10 (**permalink**) 02/11/2006, 12:44

holas, creo q tengo el mismo problema, pero lo mio es a base de una tabla(centrada) con imagen de fondo, en la cual tengo capas con imagenes. Cuando cambio la resolucion solo las capas se mueven hacia la izquerda; me encantaria ponerles el codigo, pero no se que parte les debo poner en especifico para no pegar todo. Ojala alguien me pueda explicar que puedo cambiar, saludos y muchas gracias.

sx7a · #11 (**permalink**) 02/11/2006, 13:38

leyendo anteriores post, veo q la solucion a mi problema es ocupar divs en vez de las capas, buscare informacion.

pd: no me reten porfis :)

Groendal · #12 (**permalink**) 03/11/2006, 07:55

Cita:

Iniciado por jossss

Hola Groendal. El problema es que el título de la página (Convivencia escolar) tiene 60 px de alto y además está en la etiqueta <p> con lo cual siempre va a sumar más de los 74 px que debería ocupar su celda. Esto influye a las medidas de las celdas contiguan que pasan a aumentar su tamaño. No se si me he explicado... Yo lo solucionaría con lo siguiente

Es un poco desesperante este DW jeje, si lo subo al servidor si que se ve bien, pero dandole a F12 no ¿¿¿??? bueno lo importante es que se publique bien. Muchas gracias...

Pero ahora si te fijas (si eres tan amable de volverlo a mirar) el logotipo está en el mismo sitio, pero las letras de abajo (convivencia y mediación) salen muy separadas. ¿Se te ocurre una solucion? ... perdona pero no tengo ni idea de código fuente.

Gracias de nuevo.

Groendal · #13 (**permalink**) 03/11/2006, 07:56

Cita:

Iniciado por juaniquillo

eso mismo iba a decir yo. Elimina el tag de paragraph. Eso me ha pasado algunas veces en DW. Solo tienes que estar pendiente del codigo y sus cambios.

Gracias a ti también... me va a tocar aprender código cuanto antes :P