Comunidad de diseño web y desarrollo en internet online

mis tablas se ven mal en Firefox

Citar            
MensajeEscrito el 29 Ene 2008 09:49 pm
buenas gente, como dice el titulo. tengo unas tablas que cuando las veo con el Internet explorer se ven perfectas, pero cuando lo hago con el firefox se ven mal.

Por ejemplo, adjunto dos imagenes de la misma tabla en los dos exploradores:

EN FIREFOX




EN INTERNET EXPLORER





saludos!!
espero me puedan ayudar

Por rorron

28 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Ene 2008 12:56 pm
PD: Rogaría a algún mod, que moviera este hilo a donde corresponda. A mí se me ocurre, a:
XHTML, CSS, Javascript y AJAX
Expertos y novatos en el diseño web de la manera correcta con estándares web.


por lo demás...
Te indico, que como no pongas el código xHTML+CSS que has usado, será IMPOSIBLE indicarte...
(lo ideal, sería que pusieras la dirección URL)

Además, te indico el que creo que es el principal problema
HAS DISEÑADO LA WEB PARA INTERNET EXPLORER
Las cosas, se hacen al revés.
    - Se diseña para los navegadores estándares y decentes (FireFox, Opera... etc)
    - Se hacen los trucos pertinentes para eso que algunos llaman "navegador" (creo que el nombre comercial, es Internet Explorer)


Te recomendaría que empezases de cero... diseñando según los estándares.
Saludos.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 30 Ene 2008 01:31 pm
jajaja yo la diseñe como pude!

si no lo mueven a esa seccion abro otro con el codigo en la otra seccion

graciass por la respuesta

slds

Por rorron

28 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Ene 2008 01:40 pm

rizome escribió:

[...] como no pongas el código xHTML+CSS que has usado, será IMPOSIBLE indicarte...
(lo ideal, sería que pusieras la dirección URL)
[...]

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 30 Ene 2008 02:09 pm
¿Tienes mal cerrada alguna etiqueta quizá, aún así. Presenta el código

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 30 Ene 2008 08:27 pm
buenas muchas gracias a ambos por tomarse el tiempo de responder, por el momento no puedo subirla a ningun host ya que todavia no me pasaron los datos.

les copio el codigo a ver si me pueden ayudar. Por mi parte note que al mover las tablas con el mouse se descolocan groseramente en firefox , encambio si las muevo, agrando o achico con el IE se ven bien.

aqui el codigo

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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="estilos.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style1 {color: #3B5999}
.style2 {color: #3AA6CC}
.style4 {
   color: #006633;
   font-weight: bold;
   font-size: 12px;
   text-align: right;
   text-decoration: none;
}
.style7 {color: #006633; font-weight: bold; font-size: 12px; text-align: right; text-decoration: none; font-family: Arial, sans-serif, Verdana; }
.style8 {
   color: #FFFFFF;
   font-weight: bold;
}
-->
</style>
</head>

<body>
<div align="center">
  <table width="717" border="0" cellpadding="0" cellspacing="0">
    <tr>
      <td width="314" height="106"><img src="logo_ilpea.jpg" alt="ILPEA" width="314" height="104" /></td>
      <td width="405"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="405" height="104">
        <param name="movie" value="topanimation.swf" />
        <param name="quality" value="high" />
        <embed src="topanimation.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="405" height="104"></embed>
      </object></td>
    </tr>
    <tr>
      <td height="60" colspan="2"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="717" height="68">
        <param name="movie" value="botonera.swf" />
        <param name="quality" value="high" />
        <embed src="botonera.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="717" height="68"></embed>
      </object></td>
    </tr>
  </table>
  <table width="717" border="0" align="center" cellpadding="0" cellspacing="0" class="top">
    <tr>
      <td width="469" height="387" bgcolor="#EFEFEF" class="texto_secundario"><p class="texto_titulos"><span class="style1"><br />
        Productos &gt;</span> <span class="style2">Laminas Magneticas Flexibles </span></p>
        <p class="texto_prcpal">Laminas Magenticas Flexibles</p>
        <table width="461" border="1" cellpadding="0" cellspacing="0" bordercolor="#999999">
          <tr>
            <td width="84" bgcolor="#B9BAA3" class="texto_productos"><span class="style8">CODIGO</span></td>
            <td width="146" bgcolor="#B9BAA3" class="texto_productos style8">ESPESOR (mm) </td>
            <td width="146" bgcolor="#B9BAA3" class="texto_productos"><span class="style8">PRESENTACION</span></td>
            <td width="21" bgcolor="#B9BAA3" class="texto_productos"><span class="style8">FUERZA MAGNETICA (gr./cm.) </span></td>
            <td width="64" bgcolor="#B9BAA3" class="texto_productos"><span class="style8">POLOS POR PULGADA (n&deg;) </span></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM030</b></td>
            <td class="texto_productos10"><div align="center">0.3 mm </div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;20</div></td>
            <td class="texto_productos10"><div align="center">16                       (2)</div></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM040</b></td>
            <td class="texto_productos10"><div align="center">0.4 mm </div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;28</div></td>
            <td class="texto_productos10"><div align="center">16                       (2)</div></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM050</b></td>
            <td class="texto_productos10"><div align="center">0.5 mm </div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;30</div></td>
            <td class="texto_productos10"><div align="center">16                       (2)</div></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM0100</b></td>
            <td class="texto_productos10"><div align="center">1.0 mm </div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;30</div></td>
            <td class="texto_productos10"><div align="center">16                       (2)</div></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM0150</b></td>
            <td class="texto_productos10"><div align="center">1.5 mm</div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;20</div></td>
            <td class="texto_productos10"><div align="center">5</div></td>
          </tr>
          <tr>
            <td height="32" bgcolor="#FFFFFF" class="texto_productos"><b>LAM0200</b></td>
            <td class="texto_productos10"><div align="center">2.0 mm </div></td>
            <td class="texto_productos10">Natural                       / Adhesivada</td>
            <td class="texto_productos10"><div align="center">&gt;30</div></td>
            <td class="texto_productos10"><div align="center">5</div></td>
          </tr>
        </table>
        <table width="461" border="0" cellspacing="0" cellpadding="0">
          <tr></tr>
        </table>
        <p class="texto_secundario">(1)                       Fuerza magn&eacute;tica t&iacute;pica medida aldespegue.<br />
(2) Sistema de magnetizado multi-polo cont&iacute;nuo exclusivo,                       que confiere una m&aacute;xima resistencia al deslizamiento.<br />
          <br />
      </p></td>
      <td width="9" valign="top" class="top">&nbsp;</td>
      <td width="227" valign="top" class="top"><div align="center" class="top">
        <p><img src="logo_OAA.jpg" alt="ISO" width="208" height="136" /><br />
            <br />
        </p>
      </div>
        <p><span class="texto_titulosSec"><img src="flecha.jpg" alt="a" width="15" height="16" /> Perfiles de Policarbonato 
        </span><span class="texto_titulosSec"><img src="flecha.jpg" alt="a" width="15" height="16" />Cintas magneticas </span><span class="texto_titulosSec"><img src="flecha.jpg" alt="a" width="15" height="16" />Burletes
      </span><span class="style4"><span class="texto_titulosSec"><img src="flecha.jpg" alt="a" width="15" height="16" />Perfiles de PVC 
      </span></span><span class="style4"><br />
          <br />
          </span></p>
        <p><span class="texto_secundario"><br />
      </span></p></td>
      <td width="12" valign="top" class="top">&nbsp;</td>
    </tr>
    <tr>
      <td height="5" colspan="4" bgcolor="#FFFFFF">&nbsp;</td>
    </tr>
    <tr>
      <td colspan="4" bgcolor="#F1F1F1"><img src="footer.jpg" alt="menu" width="698" height="44" border="0" usemap="#Map" />
        <map name="Map" id="Map">
          <area shape="rect" coords="12,20,61,36" href="inicio.html" />
          <area shape="rect" coords="67,20,168,36" href="quienessomos.html" />
          <area shape="rect" coords="176,20,238,36" href="clientes.html" />
          <area shape="rect" coords="244,19,318,37" href="productos.html" />
          <area shape="rect" coords="325,18,396,37" href="ubicacion.html" />
          <area shape="rect" coords="401,18,467,36" href="contacto.html" />
        </map>      </td>
    </tr>
  </table>
</div>
</body>
</html>


saludos

Por rorron

28 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Ene 2008 08:36 pm
consegui host, les paso la direccion donde aloje el html

http://www.restauraciondigital.com/test/laminas.html

Por rorron

28 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Ene 2008 09:11 pm
Me voy a esforzar para que no parezca una bronca, pero...
:latigo:
¿Acaso has diseñado tú ese código?
¿Realmente lo has escrito tú?
¿Has puesto esto?
________<table width="461" border="0" cellspacing="0" cellpadding="0">

__________<tr></tr>
________</table>

¬¬
Por favor... revisa el código... pues como bien apuntaba Aoyama (nos ha salido "adivino"), el problema está en que el HTML es un verdadero desastre.

CONSEJOS:
- Usa un editor de texto plano (tipo "notepad"). No uses Publisher, Word, ni Dreamweaver, si no sabes xHTML.
- Usa una guía de xHTML y CSS.
- No maquetes con tablas. Maqueta con <div>s y CSS.
- Usa las tablas, sólo para lo que son: presentar datos ordenados.
- Pon atención en el código HTML que generes. Revisa TODAS sus aperturas y cierres.
- En xHTML, TODAS las etiquetas se cierran. Los "<br>", por ejemplo, se escriben así: "<br />"


PD: La tabla... lo que es la tabla, propiamente dicha, sí que está bien diseñada, y se ve bien en FireFox. El problema aparece, cuando le añades toooooooodas las demás etiquetas, que llenan de errores el entorno de la misma, hasta tal punto, de no poderse mostrar adecuadamente.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 30 Ene 2008 09:27 pm
es que de codigo me resulta muy complicado, yo no escribo nada de codigo, hago todo con dreamweaver, de ahi es que me lo llena solo los divs y demas cosas!

por otro lado yo simplemente hice una base en html y luego le agregue un archivo flash, pero nunca cree un XHTML de cero, bah nisiquiera se lo que es... deberia leer toda esa guia :P

Por rorron

28 de clabLevel



 

firefox
Citar            
MensajeEscrito el 30 Ene 2008 09:56 pm
Como te digo, la mejor manera de hacer algo, es sabiendo hacerlo.
Usar programas que te "hacen el trabajo duro", te da la falsa idea de que controlas el problema, cuando cada vez estás más lejos.

Lo ideal, sería que te lo tomaras con calma, y empezases poco a poco, como te digo, con una guía de xHTML y CSS (te aconsejo los libros "Guía práctica para usuarios", de ANAYA)
y
...y un editor de texto plano (tipo "notepad")

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 31 Ene 2008 12:33 am
A ver, a ver. Aclaración por favor. Dreamweaver es un excelente editor de código, por supuesto que el modo de diseño apesta, pero, ¿que desarrollador serio en su sano juicio lo usaría?, de ahí lo que decía sobre no desestimar una herramienta. Rizome, ¿no conces Eclipse + Aptana? No te limites (ni limites a los demás) a usar herramientas demasiado básicas por querer hacer todo "a pelo".

rorron, las tablas tiene un renderizado arriba a izquierda si mal no recuerdo, eso quiere decir que lo que coloques dentro, no necesariamente se ajusta en automático a tu tabla tu problema parece ser ese.

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 31 Ene 2008 01:07 am
No pretendo decir que haya que diseñar con Notepad.
Lo que pretendo decir, es que para la gente que no tiene ni idea de xHTML, lo que es más apropiado (siempre desde el punto de vista didáctico) es comenzar desde el principio: desde la base del HTML: "texto plano".
(y de hecho, hacerlo de este modo, es la mejor manera de no "limitarte". (Considero pues, que la limitación, viene impuesta por cuanto más específico es el programa que se usa para el diseño, y no al revés.)

Indudablemente, una vez conoces el lenguaje, hay editores infinitamente mejor que el Notepad, que ayudan al creador en las labores de maquetado, diseñado, previsualización, depuráción de errores...

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 31 Ene 2008 02:24 am

rizome escribió:

siempre desde el punto de vista didáctico) es comenzar desde el principio: desde la base del HTML: "texto plano".


No necesariamente, te lo dice alguien que lleva más de 5 años dando cursos de PHP, XHML, CSS, Javascript y Etc. y muchas veces con Dreamweaver y a personas que no tiene un conocimiento especializado. Puedo notar que nunca haz usado el editor de código de Dreamwaver o algún editor especializado. Rizome, no pretendo convertir esto en un campo de batalla ni nada, pero no me parece correcta tu postura. Si tienes cualquier otro comentario, te invito a hacerlo por MP para ya no desviar el tema principal del post

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

 

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