Foros del Web » Creando para Internet » HTML »

web en firefox & IE

Estas en el tema de web en firefox & IE en el foro de HTML en Foros del Web. Bueno como saben mucha gente tiene IE [de los usuarios :S] y para no perde rgente hay que hacer una web compatible para todo y ...
  #1 (permalink)  
Antiguo 16/10/2008, 22:43
 
Fecha de Ingreso: diciembre-2007
Mensajes: 927
Antigüedad: 10 años
Puntos: 12
web en firefox & IE

Bueno como saben mucha gente tiene IE [de los usuarios :S] y para no perde rgente hay que hacer una web compatible para todo y pss cmo no soye xperto en HTML nesesito su gran ayuda. esta web http://minisecreto.com es compatible con todos menos con IE ya que se ve feo, aqui les dejo lso codes.

salu2

Código PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd"
>
<
html>
<
head>
<
title>YOURSITE[dot]COM</title>
<
meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<
link rel="stylesheet" type="text/css" href="css.css" />
</
head>

<
body>
<
div id="menu2">
  <
table width="170" border="0" cellpadding="0" cellspacing="0">
    <
tr>
      <
td width="5"><img src="images/image_22.gif" width="5" height="19"></td>
      <
td width="160" class="box_head">&nbsp;</td>
      <
td width="5"><img src="images/image_24.gif" width="5" height="19"></td>
    </
tr>
    <
tr>
      <
td colspan="3" class="box">&nbsp;</td>
    </
tr>
    <
tr>
      <
td colspan="3">&nbsp;</td>
    </
tr>
    <
tr>
      <
td colspan="3">&nbsp;</td>
    </
tr>
  </
table>
</
div>
<
div id="menu">
  <
table width="170" border="0" cellpadding="0" cellspacing="0">
    <
tr>
      <
td width="5"><img src="images/image_22.gif" width="5" height="19"></td>
      <
td width="160" class="box_head">&nbsp;</td>
      <
td width="5"><img src="images/image_24.gif" width="5" height="19"></td>
    </
tr>
    <
tr>
      <
td colspan="3" class="box">&nbsp;</td>
    </
tr>
    <
tr>
      <
td colspan="3">&nbsp;</td>
    </
tr>
    <
tr>
      <
td colspan="3">&nbsp;</td>
    </
tr>
  </
table>
</
div>
<
div id="container">
  <
table class="main_table" border="0" cellpadding="0" cellspacing="0">

<
tr>
<
td width="12"><img src="images/image_01.gif" width="4" height="27" alt=""></td>
<
td background="images/image_05.gif" width="8"><img src="images/spacer.gif" width="8" height="1"></td>
<
td class="nav_this"><img src="images/home.gif" width="73" height="27"></td>
<
td class="nav" onMouseOver="this.className='nav_over'" onMouseOut="this.className='nav'"><a href="page.html"><img src="images/about.gif" width="73" height="27" border="0"></a></td>
<
td class="nav" onMouseOver="this.className='nav_over'" onMouseOut="this.className='nav'"><img src="images/design.gif" width="73" height="27" border="0"></td>
<
td class="nav" onMouseOver="this.className='nav_over'" onMouseOut="this.className='nav'"><img src="images/links.gif" width="73" height="27"></td>
<
td width="100%" align="center" background="images/image_05.gif" class="small_text">&nbsp;</td>
<
td width="4"><img src="images/image_06.gif" width="4" height="27" alt=""></td>
</
tr><tr>
<
td colspan="1" height="15" width="4"><img src="images/image_09.gif"></td>
<
td colspan="6" height="15" width="100%" background="images/image_11.gif"></td>
<
td colspan="1" height="15" width="4"><img src="images/image_10.gif"></td>
</
tr><tr>
<
td colspan="1" height="109" width="4"><img src="images/image_12.gif"></td>
<
td colspan="6" height="109" width="100%" background="images/image_13.gif" align="center">

<
table border="0" cellpadding="0" cellspacing="0" width="98%">
<
td width="2"><img src="images/image_19.gif"></td>
<
td width="40%" background="images/image_20.gif" valign="middle" align="center"><img src="images/header.gif"></td>
<
td width="2" background="images/image_20.gif"><img src="images/h-div.gif"></td>
<
td width="60%" align="center" valign="top" background="images/image_20.gif" class="login_box"Cualquier Cosa Puede Ir Aqui... </td>
<
td width="3"><img src="images/image_21.gif"></td>
</
table></td>
<
td colspan="1" height="109" width="4"><img src="images/image_14.gif"></td>
</
tr><tr>
<
td colspan="1" height="1" width="4"><img src="images/image_15.gif"></td>
<
td colspan="6" height="1" width="100%" bgcolor="#495271"></td>
<
td colspan="1" height="1" width="4"><img src="images/image_16.gif"></td>
</
tr><tr>
<
td colspan="1" height="1" width="4" background="images/image_17.gif"></td>
<
td colspan="6" height="1" width="100%" bgcolor="#686D8B">
<
img src="images/spacer.gif" height="2"><br>
<
table border="0" cellpadding="0" cellspacing="0" width="98%" align="center">
<
tr>
<
td><img src="images/image_22.gif"></td>
<
td class="box_head">Como Editar </td>
<
td><img src="images/image_24.gif"></td>
</
tr><tr>
<
td colspan="3" class="box"><p><strong><BR>EDITANDO LA NAVEGACION</strong></p>
  <
br>
    
El texto de los tabs de la navegacion son imagenesPara editar el texto abran la carpeta PSD's y dentro van a encontrar un archivo llamado &quot;nav.psd&quot;. Abrilo con Photoshop y cambiale el texto. Cuando queres que un tab te aparezca por encima de todos los demas, como ahora lo esta haciendo el tan que dice HOME, tenes que cambiarle el estilo de la celda por lo siguiente: <em>class=&quot;nav_this&quot;.</em>
   <BR><BR>El banner que dice &quot;YourSite&quot; puede ser editado entrando a la carpeta PSD'
s y abriendo el archivo &quot;banner.psd&quotcon Photoshop.
  <
p><br>
    
I hope you enjoy this free template brought to you by Chronic and Zymic.com</p></td>
</
tr>
</
table>
<
img src="images/spacer.gif" height="2"><br>
<
table border="0" cellpadding="0" cellspacing="0" width="98%" align="center">
<
tr>
<
td><img src="images/image_22.gif"></td>
<
td class="box_head">Template byChronic --- READ THIS </td>
<
td><img src="images/image_24.gif"></td>
</
tr><tr>
<
td colspan="3" class="box">Welli havnt been submitting much lately so i decided its about time for another templateThis template is extremely easy to edit. <br>
<
br>
<
strong>EDITING THE NAVIGATION:</strong><br>
The text for the navigation links up above are in transparent .gif's.  The PSD for these files is in the folder <br>
&quot;PSD'
s" and is called nav.psd  OR if you are feeling adventurous you can even just put text strait into the nav cells.  It wont interfere with the roll over effect.
<br>
<br> When you want the current page to be the front tab change that cell style to " 
<i>class="nav_this"</i"<br><br>  The header psd is also in the "PSDs" folder, its called "banner.psd"
<br><br>  I hope you enjoy this free template brought to you by Chronic and Zymic.com</td>
</tr>
</table>
<img src="
images/spacer.gif" height="2"><br>
</td>
<td colspan="
1" height="1" width="4" background="images/image_18.gif"></td>
</tr><tr>
<td colspan="
1"><img src="images/image_25.gif"></td>
<td colspan="
6" align="center" background="images/image_27.gif" class="small_text">Copyright &copy; YourSite.com <strong>||</strong> Site Design by: <a href="http://www.zymic.com">Zymic.com </a> </td>
<td colspan="1"><img src="images/image_26.gif"></td>
</
tr>
</
table>
</
div>
</
body>
</
html
Código PHP:
/* CSS Document */

bodyfont-familyVerdanaArialHelveticasans-serif;
    
font-size9;
    
margin-top5px;
    
margin-bottom0px;
    
margin-right0px;
    
margin-left0px;
    
color#B6BBD2;
    
background-color#7B819A;
    
background-imageurl(images/bg.gif);
    
background-positiontop;
    
background-repeatrepeat-x
    
text-aligncenter;}
    
a:linkCOLOR#495271; text decoration: none; font-style: normal; }
a:visitedCOLOR#495271; text decoration: none; font-style: normal; }
a:hoverCOLOR#B6BBD2; text decoration: none; font-style: normal; }
    
#container {
    
width650px;
    
margin-left300px;
}
    
.
main_tablewidth650px; }

.
small_textfont-size10px; }

.
login_boxfont-size10px;
    
padding-top3px;
    
padding-bottom3px; }

.
nav_thiswidth73px;
    
height27px;
    
background-imageurl(images/image_02.gif);
    
background-positionleft;
    
background-repeatno-repeat; }

.
navwidth73px;
    
height27px;
    
background-imageurl(images/image_03.gif);
    
background-positionleft;
    
background-repeatno-repeat; }
    
.
nav_leftwidth73px;
    
height27px;
    
background-imageurl(images/image_03_left.gif);
    
background-positionleft;
    
background-repeatno-repeat; }
    
.
nav_overwidth73px;
    
height27px;
    
background-imageurl(images/image_04.gif);
    
background-positionleft;
    
background-repeatno-repeat; }
    
.
nav_over_leftwidth73px;
    
height27px;
    
background-imageurl(images/image_04_left.gif);
    
background-positionleft;
    
background-repeatno-repeat; }
    
.
formbackground-color#A7ADC7;
    
border1px solid #35394F;
    
color#35394F;
    
margin-bottom2px;
    
font-size10px;
    
width90px;
    
height13px; }
    
.
form_loginbackground-color#A7ADC7;
    
border1px solid #35394F;
    
color#35394F;
    
margin-bottom2px;
    
font-size10px;
    
width90px;
    
height13px; }
    
.
form_submitfont-size9px; }
    
.
box_headbackground-imageurl(images/image_23.gif);
    
font-size10px;
    
font-weightbold;
    
width100%; }
    
.
boxbackground-color#6C718B;
    
border-left1px solid #444961;
    
border-right1px solid #444961;
    
border-bottom1px solid #444961;
    
font-size10px; }

#menu {
    
width170px;
    
height100%;
    
floatleft;
    
clearnone;
    
margin-top160px;
    
margin-left100px;
}
#menu2 {
    
position:absolute;
    
left:975px;
    
top:160px;
    
width:107px;
    
height:76px;
    
z-index:1;

  #2 (permalink)  
Antiguo 16/10/2008, 23:07
Avatar de hitech  
Fecha de Ingreso: octubre-2008
Ubicación: Chiquimula
Mensajes: 72
Antigüedad: 9 años, 2 meses
Puntos: 1
Respuesta: web en firefox & IE

Mira. Muchas personas me han criticado por aconsejar el uso de tablas. Pero hasta aqui es la solucion mas rapida que encuentro (por lo menos en mi caso). Todo depende de tu CSS al parecer tienes que hacer uno que sea leido deacuerdo al navegador que lo visita. Saludos

http://jracostac.blogspot.com
  #3 (permalink)  
Antiguo 17/10/2008, 10:58
 
Fecha de Ingreso: diciembre-2007
Mensajes: 927
Antigüedad: 10 años
Puntos: 12
Respuesta: web en firefox & IE

mm osea uno especial para IE?
  #4 (permalink)  
Antiguo 17/10/2008, 11:21
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: web en firefox & IE

Cita:
Iniciado por hitech Ver Mensaje
Muchas personas me han criticado por aconsejar el uso de tablas.
Pues sí, y yo voy a ser una de ellas, pero no porque sí, sino con hechos: como vés, el uso de tablas no le está resolviendo nada al usuario que ha hecho la consulta.

No imagino por qué recomiendas el uso de tablas para maquetar.
__________________
Visita mi nueva web idplus.org
  #5 (permalink)  
Antiguo 17/10/2008, 15:46
 
Fecha de Ingreso: diciembre-2007
Mensajes: 927
Antigüedad: 10 años
Puntos: 12
Respuesta: web en firefox & IE

mm Mikmoro yo normalmente hago todo con tablas es mas facil para acomodar pero como estoe s una plantilla y venia con margenes css en IE me queda mal :S, aparte las tablas se adaptan al navegador del usuario, es decir que siempre estan centradas xD y con los maregenes no solo estan en 800X600 O 1200X800 etc...

salu2
  #6 (permalink)  
Antiguo 17/10/2008, 16:32
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: web en firefox & IE

Siento decirte que estás bastante equivocado:

Cita:
Iniciado por Edig Ver Mensaje
yo normalmente hago todo con tablas es mas facil para acomodar
No. Seguramente a ti te resulta más fácil de acomodar, pero no "es" más fácil de acomodar; es todo cuestión de práctica y experiencia.

Cita:
Iniciado por Edig Ver Mensaje
pero como estoe s una plantilla y venia con margenes css en IE me queda mal :S,
No, lo que te están fallando son las tablas en IE, no los márgenes con css.

Cita:
Iniciado por Edig Ver Mensaje
aparte las tablas se adaptan al navegador del usuario, es decir que siempre estan centradas xD y con los maregenes no solo estan en 800X600 O 1200X800 etc...
¿Crees que hay alguna dificultad para hacer un diseño líquido (que se adapte a la resolución) con cajas en luegar de tablas? De hecho es más fácil, porque a veces las tablas te jeugan malas pasadas con los anchos que no ocurre con las cajas.

¿Cómo crees que están hechas miles de páginas que has visto que se adptan al ancho y no tienen tablas?

En fin, por centrarnos en el tema de la consulta, creo que el problema te lo producen las tablas. Miraré a ver si veo el problema.
__________________
Visita mi nueva web idplus.org
  #7 (permalink)  
Antiguo 17/10/2008, 16:48
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: web en firefox & IE

Bueno, en realidad el problema te lo produce un cierto desorden en los elementos y una mala configuración.

¿Tú cómo quisieras que se vea? ¿como se ve ahora en firefox? ¿la has visto en 1024? (tiene scroll horizontal) ¿quieres que se vea así? ¿has visto lo que ocurre con lo que tú llamas "menu2" cuando varías el tamaño de la ventana?

Si me dices puedo intentar ayudarte, aunque si efectivamente te resulta más fácil acomodar las cosas con tablas, igual lo mejor es que quites los divs de la plantilla y lo hagas con tablas.
__________________
Visita mi nueva web idplus.org
  #8 (permalink)  
Antiguo 17/10/2008, 19:14
 
Fecha de Ingreso: mayo-2008
Mensajes: 64
Antigüedad: 9 años, 6 meses
Puntos: 0
Respuesta: web en firefox & IE

yo no se diseño, pero, si no es con tablas que es lo siguiente mejor?
  #9 (permalink)  
Antiguo 17/10/2008, 21:33
Avatar de NUCKLEAR
Moderador radioactivo
 
Fecha de Ingreso: octubre-2005
Ubicación: Cordoba-Argentina
Mensajes: 5.688
Antigüedad: 12 años, 1 mes
Puntos: 890
Respuesta: web en firefox & IE

Cita:
Iniciado por DjCasius Ver Mensaje
yo no se diseño, pero, si no es con tablas que es lo siguiente mejor?
Con Css y html
tablas = tabular
Css-Xhtml = maquetar
veras que es mucho mas facil con css y xhml www.librosweb.es
saludos
__________________
Drupal Argentina
  #10 (permalink)  
Antiguo 18/10/2008, 00:51
Avatar de MoDoRrO  
Fecha de Ingreso: septiembre-2005
Ubicación: Php+Flash+AS
Mensajes: 1.072
Antigüedad: 12 años, 2 meses
Puntos: 12
Respuesta: web en firefox & IE

yo uso IE, de hecho, odio firefox, y tu web se ve mal en una configuracion de
1280x800
  #11 (permalink)  
Antiguo 18/10/2008, 17:51
 
Fecha de Ingreso: diciembre-2007
Mensajes: 927
Antigüedad: 10 años
Puntos: 12
Respuesta: web en firefox & IE

mm pues miren ya lo he puesto con tablas y he variado la ventana y se ve perfecto claro llega aun punto que nesesita scroll horizontal pero bno :P

mirenla de new http://minisecreto.com/

PD. esta hecha con tablas + css
  #12 (permalink)  
Antiguo 18/10/2008, 18:11
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: web en firefox & IE

Si eso es lo que querías conseguir es perfecto

Acuérdate de pasar el validador de la w3c: hay 173 errores.

Saludos.
__________________
Visita mi nueva web idplus.org
  #13 (permalink)  
Antiguo 18/10/2008, 19:13
nfo
 
Fecha de Ingreso: octubre-2008
Ubicación: EsPaCiO TiEmPo
Mensajes: 404
Antigüedad: 9 años, 1 mes
Puntos: 5
Respuesta: web en firefox & IE

siemrpe siemrpe con div nunca con tablas!!! las tablas fueron diseñadas para mostrar datos nunca para maquetar.

El uso de tablas es el no saber diseñar en css. Hace poco di un curso de Diseño Web y a mis alumnos les acostumbre hacerlo con div, a final del curos estaban contentos porque vieron que era más facil que usar tablas, siendo asi una chapuza.
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:20.