Regresar a la página www.ComoCrearTuWeb.com
Resultados 1 al 5 de 5

Tema: Mi web se ve diferente con los distintos navegadores

  1. #1
    Recien Llegado! Habitual
    Fecha de Ingreso
    16 oct, 08
    Mensajes
    13
    Poder de Reputación
    18

    Mi web se ve diferente con los distintos navegadores

    Hola, lo peor de todo es el menú lateral, que en en mozilla y ópera se ven arriba, en lugar de en el lateral, además, hice tablas para colocar las imágenes con el programa Nvu y se ven raras las imágenes que tienen enlaces (por ejemplo en Galería de imágenes).

    http://www.escayolas-avh.com

    Código html
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <html>
    <head>
    <LINK REL="SHORTCUT ICON" HREF="objetos/capitel.ico">
    <title>Decoración en escayola, escayolistas, presupuestos sin compromiso.</title>
    <META content="En esta web encontrarás la mayor oferta de decoración en escayola, con los mejores profesionales escayolistas. Además podrás ver una breve muestra de los tipos de elementos decorativos en escayola que existen en el mercado, tales como molduras, cornisas, murales, arcos. Además, se realizan trabajos en obra nueva como falsos techos, vigas, fosas, etc." name="description">
    <META content="escayola, escayolistas, decoración, molduras, cornisas, columnas, arcos, murales, techos, desmontables" name="keywords">
    <link rel="stylesheet" href="estilo.css" type="text/css" media="all">
    <link rel="stylesheet" href="estilo-menu-desplegable.css" type="text/css" media="all">
    <script language="javascript" src="no-tocar.txt" type="text/javascript"></script>
    <script language="javascript" src="numero-de-menus.txt" type="text/javascript"></script>
    </head>
    <body onload="init();">
    <div id="global">
    <div id="curva-superior"></div>
    <div id="cabecera">
    <div id="logotipo">[img]objetos/LogoAVH.png[/img]</div>
    <div id="publicidad">Más de 40 años decorando con escayola</div>
    </div>
    <div id="navegacion">
    <ul>[*]Productos[*]<a href=galeria.html>Galería de imágenes</a>[*]<a href=contacto.html>Contacto<a/>[/list]
    </div>
    <div id="contenido">
    <div id="menu">
    <h1>Productos</h1>
    <ul>[*]Molduras[img]objetos/Cornisa%20(21).jpg[/img][*]Cornisas[img]objetos/Cornisa%20(29).jpg[/img][*]
    Columnas[img]objetos/Columna%20(2).gif[/img][*]Arcos[img]objetos/Arco%20(3).gif[/img][*]Techos[img]objetos/Techo%20(1).bmp[/img][/list]
    </div>
    <h1><font face="Centaur" size="4 "><font color="#706464">E</font><font color="#7B5C5C">s</font><font color="#845656">c</font><font color="#8D5050">a</font><font color="#994848">y</font><font color="#A24141">o</font><font color="#AB3B3B">l</font><font color="#B63333">i</font><font color="#BF2D2D">s</font><font color="#C82626">t</font><font color="#D41E1E">a</font><font color="#DD1818">s</font><font color="#E81010"> </font><font color="#F10A0A">c</font><font color="#FA0303">o</font><font color="#FF0000">n</font><font color="#FF0000"> </font><font color="#FF0000">m</font><font color="#FF0000">á</font><font color="#FF0000">s</font><font color="#FF0000"> </font><font color="#FF0000">d</font><font color="#FF0000">e</font><font color="#FF0000"> </font><font color="#FF0000">4</font><font color="#FF0000">0</font><font color="#FF0000"> </font><font color="#FF0000">a</font><font color="#FF0000">ñ</font><font color="#FF0000">o</font><font color="#FA0303">s</font><font color="#F10A0A"> </font><font color="#E81010">d</font><font color="#DD1818">e</font><font color="#D41E1E"> </font><font color="#C82626">e</font><font color="#BF2D2D">x</font><font color="#B63333">p</font><font color="#AB3B3B">e</font><font color="#A24141">r</font><font color="#994848">i</font><font color="#8D5050">e</font><font color="#845656">n</font><font color="#7B5C5C">c</font><font color="#706464">i</font><font color="#696969">a</font></font></h1>


    Realizamos todo tipo de trabajos en escayola tanto en obra nueva como en
    reformas, con la máxima profesionalidad y los precios más
    competitivos del mercado.</p>
    <h1><font face="Centaur" size="4 "><font color="#775F5F">T</font><font color="#845656">o</font><font color="#944B4B">d</font><font color="#A44040">o</font><font color="#B23636"> </font><font color="#C22B2B">u</font><font color="#D22020">n</font><font color="#DF1616"> </font><font color="#EF0B0B">m</font><font color="#FF0000">u</font><font color="#FF0000">n</font><font color="#FF0000">d</font><font color="#FF0000">o</font><font color="#FF0000"> </font><font color="#FF0000">d</font><font color="#FF0000">e</font><font color="#FF0000"> </font><font color="#FF0000">p</font><font color="#FF0000">o</font><font color="#FF0000">s</font><font color="#EF0B0B">i</font><font color="#DF1616">b</font><font color="#D22020">i</font><font color="#C22B2B">l</font><font color="#B23636">i</font><font color="#A44040">d</font><font color="#944B4B">a</font><font color="#845656">d</font><font color="#775F5F">e</font><font color="#696969">s</font></font></h1>


    Realizamos todo tipo de trabajos como</p>


    colocación de falsos techos en escayola y techo desmontable,</p>


    montaje de techos acústicos, tabiquería,</p>


    colocación de elementos decorativos: cornisas, molduras, columnas, murales, arcos, plafones.</p>


    [img]objetos/collage.jpg[/img]
    <h1><font face="Centaur" size="4 "><font color="#746161">T</font><font color="#805959">o</font><font color="#8D5050">d</font><font color="#9B4646">o</font><font color="#A93C3C"> </font><font color="#B43434">t</font><font color="#C22B2B">i</font><font color="#CF2121">p</font><font color="#DB1919">o</font><font color="#E81010"> </font><font color="#F60606">d</font><font color="#FF0000">e</font><font color="#FF0000"> </font><font color="#FF0000">d</font><font color="#FF0000">e</font><font color="#FF0000">c</font><font color="#FF0000">o</font><font color="#FF0000">r</font><font color="#FF0000">a</font><font color="#FF0000">c</font><font color="#FF0000">i</font><font color="#FF0000">ó</font><font color="#FF0000">n</font><font color="#F60606"> </font><font color="#E81010">e</font><font color="#DB1919">n</font><font color="#CF2121"> </font><font color="#C22B2B">e</font><font color="#B43434">s</font><font color="#A93C3C">c</font><font color="#9B4646">a</font><font color="#8D5050">y</font><font color="#805959">o</font><font color="#746161">l</font><font color="#696969">a</font></font></h1>


    Propónganos su diseño y nosotros lo realizaremos, con los mejores
    materiales y en la mayor brevedad posible.</p>


    </div>
    <div id="curva-inferior"></div>
    </div>
    <script language="javascript" src="definir-menus1.txt" type="text/javascript"></script>
    </body>
    </html>

    Hoja de estilos
    * {text-indent:0px ; margin:0px ; padding:0px ; border:0px ; font-family: centaur}
    p {text-align: justify ; padding-bottom:2px}
    h1 {font-size: 1.2em; color:dimgray ; font-weight: bold ; text-decoration: none ;
    text-align: center ; padding-top:15px ; padding-bottom:2px}
    h2 {font.size: 1.1em; color:dimgray ; font-weight: bold ; text-decoration: none ;
    text-align: center}
    body {background-image: url(objetos/w-vista3-1.jpg) ; text-align: center ; background-position: center center ; background-repeat: no-repeat ; height:100%; }
    #global {width:800px ; margin:4px auto }
    #curva-superior { background-image: url(objetos/curva-superior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }
    #cabecera {background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid ; height:85px}
    #logotipo {width:280px ; float:left }
    #publicidad { padding-top:30px ;padding-bottom:30px; font-size: 1.5em; color:black ; width:518px ; float:left ; margin-top:0px; margin-bottom:5px ;margin-right:0px; font-style: italic ;FILTER:progid:DXImageTransform.Microsoft.Gradient (startColorstr='#FF0000',endColorstr='#999999', gradientType='1') }
    #navegacion { background-color: darkgray ; border: black 1px solid ; height:20px }
    #navegacion li {float:left ; list-style:none ; margin: 0px 20px 0px 20px }
    #navegacion ul { margin-left: 200px ; font-size: 1.1em }
    #contenido { background-color: white ; border-left: black 1px solid ;
    border-right: black 1px solid }
    #contenido p { margin: 5px 10px 0px 10px ; text-indent: 15px ; text-align: center}
    #menu {background-color: none ; width: 150px ; float:left ;
    text-align:left ; margin: 20px 10px 3px 40px ;
    background-image: url(objetos/menu-parte-inferior1.gif);
    background-position: bottom }
    #menu li {list-style:none ; margin: 6px 10px 10px 23px }
    #menu h1 {text-decoration:none ; font-size:13px ; padding-top:12px ;
    background-image: url(objetos/menu-parte-superior1.gif) }
    #curva-inferior { background-image: url(objetos/curva-inferior.gif) ;
    background-repeat: no-repeat ;
    width: 800px ;
    height:12px ;
    overflow: hidden }
    a {color: black ; text-decoration:none ; display: block }
    a:link {}
    a:visited {}
    a:hover {color:#FF0000 ; text-decoration:none ; background-color: none ; font-style: bold }
    a:active {}
    #logotipo a {}
    #logotipo a:link {}
    #logotipo a:visited {}
    #logotipo a:hover {background-color: white }
    #logotipo a:active {}

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de omar.piamba
    Fecha de Ingreso
    09 dic, 07
    Ubicación
    Colombia, Trinidad (Casanare)
    Mensajes
    332
    Poder de Reputación
    20

    Diferente

    Hola: Así por encima encuentro que el logo tiene 88px de alto y la cabecera sólo tiene 85px; por tal motivo el logo desplaza las palabras de la navegación hacia abajo y empieza el descuadre...
    Más adelante le colaboro otro tanto pues aquí en mi país tenemos las 23:45 del 06 Dic y creo que es hora de dormir...pero ¡NO SE DESANIME!!!

    Vaya con calma que los errores son los que nos dan la experiencia.
    Como dijo un sabio:
    "No tropieza el que no camina"

    Un amigo desde Colombia,

  3. #3
    Recien Llegado! Habitual
    Fecha de Ingreso
    16 oct, 08
    Mensajes
    13
    Poder de Reputación
    18
    Muchas gracias, ya lo he cambiado. Oye no sé si sabrás por qué me pasa esto: el menú tiene los bordes del curso, pero como he metido imágenes dentro desparecen los bordes en los navegadores, sin embargo en HTML-kit si que están, ¿cómo lo podría solucionar?


  4. #4
    Esto empieza a ser un vicio... Habitante Avatar de omar.piamba
    Fecha de Ingreso
    09 dic, 07
    Ubicación
    Colombia, Trinidad (Casanare)
    Mensajes
    332
    Poder de Reputación
    20

    Bordes

    Pues según estuve buscando la imágenes de fondo del menú, NO se encuentran en la carpeta de objetos: sería volverlas a subir así el editor le diga que ya las tiene... (las demás sí se dejan ver en la carpeta de objetos)

    Un amigo desde Colombia,

  5. #5
    Moderador CCTW Habitante Avatar de johnpeterjp
    Fecha de Ingreso
    13 abr, 06
    Ubicación
    Santiago de Chile
    Mensajes
    3,142
    Poder de Reputación
    36

    Hola...

    Una de las tareas más difíciles, desgastantes y tediosas para un diseñador web, es el hacer compatible su sitio web para diferentes navegadores. Todo marcha bien cuando probamos nuestro sitio, o el diseño de nuestro nueva web en IExplorer pero cuando los probamos con Firefox u Opera, y algunas veces con Safari, nuestro sitio se deforma totalmente. El problema está en la eceptacion de los estandares en diseño y html, caso que cumplen navegadores como firefox, no así explorer... que está hecho para hacernos creer que todo está ok. Te aconsejo siempre compruebes tu diseño en explorer y firefox y q los pequeños detalles los omitas, o te vuelves loco intentando hacer un diseño compatible para cada navegador... pon atencion al post anterior, y hecha una mirada a esto para que vayas dilusidando este embroyo... http://wharton.universia.net/index.c...Article&id=938
    "Conocimiento es necesidad, necesidad es conocer lo que necesitamos"


Temas Similares

  1. Ve tu web en distintos navegadores
    Por splaing en el foro Off-Topic
    Respuestas: 1
    Último Mensaje: 08/02/2009, 04:44

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes
  •