Firefox mal, ie bien....

Snake nS · #1 (**permalink**) 03/06/2005, 13:39

Dado que las capas no me convencieron me decidi por maquetar en tablas usando css.....

El problema es que se visualisa mal menuhorisontal,menuhorisontalcuadradito,horisontal 2.....

Se ven como decorridos los fondos...... en ie se ve perfecto...

Archivo html:

Código:

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

<body>

<table border="0" cellpadding="0" cellspacing="0" class="pagina">
  <tr>
    <td valign="top"><table width="779" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td colspan="3" class="arriba1"><img src="../Images/transparente.gif" width="25" height="15"/></td>
      </tr>
      <tr>
        <td height="59" colspan="3" class="arriba2"></td>
      </tr>
      <tr>
        <td class="menuhorisontal"></td>
        <td class="menuhorisontalcuadradito"></td>
        <td class="horisontal2"></td>
      </tr>
      <tr>
        <td colspan="3"></td>
      </tr>
    </table></td>
  </tr>
</table>

</body>
</html>

Archivo css:

Código:

body {
	margin-left: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	background-color: #CCCCCC;
}.arriba1 {
	background-image: url(../Images/design_01.gif);
}
.arriba2 {
	background-image: url(../Images/design_02.gif);
}
.menuhorisontal {
	background-image: url(../Images/Design2-remix_02.gif);
	width:123px;
	height:24px;
}
.menuhorisontalcuadradito {
	background-image: url(../Images/Design2-remix_03.gif);
	width:17px;
}
.horisontal2 {
	background-image: url(../Images/Desing2-remix_04.gif);
	width:638;
}
.pagina {
    width:779px;
	height:321px;
	margin-right: auto;
	margin-left: auto;
}

Salu2

Durgeoble · #2 (**permalink**) 03/06/2005, 13:50

Asegurate de poner el !Doctype y echale un vistazo al modelo de cajas (bastante comentado por los foros).

Aunque te recomiendo usar capas, son mucho mas versatiles y utiles

Snake nS · #3 (**permalink**) 03/06/2005, 20:48

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" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Documento sin t&iacute;tulo</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="estilos.css" rel="stylesheet" type="text/css" />
</head>

<body>

<table border="0" cellpadding="0" cellspacing="0" class="pagina">
  <tr>
    <td valign="top"><table width="779" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td colspan="3" class="arriba1"><img src="../Images/transparente.gif" width="25" height="15"/></td>
      </tr>
      <tr>
        <td height="59" colspan="3" class="arriba2"></td>
      </tr>
      <tr>
        <td class="menuhorisontal"></td>
        <td class="menuhorisontalcuadradito"></td>
        <td class="horisontal2"></td>
      </tr>
      <tr>
        <td colspan="3"></td>
      </tr>
    </table></td>
  </tr>
</table>

</body>
</html>

Ahi esta el codigo completo, sin embargo no hay caso......

Durgeoble · #4 (**permalink**) 03/06/2005, 23:05

No veo el problema (tal vez sea por no tener las imagenes) pues a mi el codigo me da exactamente el resultado que interpreto ¿que idea llevabas?

Snake nS · #5 (**permalink**) 04/06/2005, 00:27

1 tabla contenedora para la pagina

despues hay una tabla con dos filas y luego otra aparte que contiene un menu, luego hay otra mas que contiene una pequeña barrita.....

Despues de esta tenemos la tabla problematica dividida en 2 celdas, en la celda izquierda se coloca un fondo, que es el inicio del menu lateral..... y se ve mal la base de la imagen... mientras que en ie se ve perfecto..

Snake nS · #6 (**permalink**) 04/06/2005, 00:39

ya descubri la diferencia, era porque la celda tenia un pixel de mas en comparacion a la imagen, y la misma era imposible de achicar, por lo tanto inserte dos gifs transparentes, en las dos celdas que componen la tabla.