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

Tema: Desorden de las DIV en distintos navegadores

  1. #1
    Recien Llegado! Pasaba por aquí...
    Fecha de Ingreso
    03 mar, 13
    Mensajes
    2
    Poder de Reputación
    0

    Desorden de las DIV en distintos navegadores

    Hola a todos,

    He seguido el curso paso a paso, el ejemplo con Divs (buenísimo, mis felicitaciones), y al terminarlo, tengo un problema. Pensé que había cometido un fallo en el código, pero luego al mirar el ejemplo final de Jorgens veo que le ocurre igual.

    El problema es que según qué navegador, los divs se desordenan totalmente al ampliar la web. Con ampliar me refiero al cargar la página en un navegador, y usar el zoom (ctrl + ruedita del ratón). Únicamente falla al alejarse, al acercarse los divs se quedan bien, pero al alejarse mucho, empiezan a amontonarse o mezclarse entre ellos. Aquí dejo el enlace final del curso para que veais lo que digo: http://www.comocreartuweb.com/objeto...a/historia.htm

    En la sección de historia por ejemplo, en Explorer al alejarnos, se queda todo bien, excepto el pie, que se amontona. En cambio, con Chrome y Firefox, al alejarnos en la misma sección, todos los divs se desordenan, tanto el pie como la barra de navegación o del menú, que pasa al lado derecho quedando todo totalmente desordenado, caótico y bastante feo.

    ¿Hay alguna manera de arreglar esto? Que los divs se queden bien colocados aunque cambiemos el tamaño d ela página? En Explorer funciona bastante bien, únicamente se distorsiona el pie.


    Gracias por adelantado.

  2. #2
    Esto empieza a ser un vicio... Habitante Avatar de Web-Freelance
    Fecha de Ingreso
    15 sep, 11
    Ubicación
    España
    Mensajes
    568
    Poder de Reputación
    19
    Hola! Lo puedes solucionar utilizando % en vez de px en diferentes contenedores, echando horas de pruebas en diferentes navegadores y sobretodo utilizando diferentes hojas de estilos dependiendo del navegador (sobretodo con IE).

    El curso de aquí pretende ser una inmersión en el grandioso mundo de las páginas web, pero el resto queda por conocer de tu parte, y para ello hacen falta horas de práctica, investigación y estudio, nada más que eso. No obstante, y para este caso concreto, no es lo normal aumentar o alejar una página hoy en día, pero sí, son detalles a tener en cuenta.

    Concluyendo, cúrrate esa misma página para que se vea bien en todos los navegadores y además que se vea bien al alejar o aumentar y verás lo que has aprendido con ello, una barbaridad, y además son cosas que no se te olvidarán simplemente porque te dieron bastantes quebraderos de cabeza ;-). Anímate a investigar por tu cuenta. Lo bueno del html-css es que no pasa nada si te equivocas... el mundo no se acaba jeje.

    Saludos!
    Agradece si te ayudan, que desagradecidos ya sobran.

  3. #3
    Recien Llegado! Pasaba por aquí...
    Fecha de Ingreso
    03 mar, 13
    Mensajes
    2
    Poder de Reputación
    0
    Gracias por responder,

    Pues si, me pondré a probar y practicar, jeje. ¿Cuál es ese método del % en vez de px? ¿No conocía esa manera, hay algúin lugar en esta web donde hablen de ello?

    Gracias nuevamente.

  4. #4
    Me va gustando esto... Habitante Avatar de Jenkins
    Fecha de Ingreso
    04 ene, 13
    Ubicación
    San Jose, Costa Rica
    Mensajes
    47
    Poder de Reputación
    15
    Es simplemente realizar el width o el heigth del div con un % (porcentaje) por ejemplo si tienes dos capas dentro de un cuerpo que de width (longitud) tiene 1000px y una capa mide 600px de widht y la otra 400px, también podrías indicarlo mediante width: 60% y width: 40% para cada capa. Algo asi en la hoja de estilos:

    body {background-color:black;}
    #contenido {width: 1000px; background-color: blue;}
    #contenido .destacado {float: left; width: 60%; background-color: white;}
    #contenido .menu {float: left; width: 40%; background-color: red;}

    como vez es una simple sustitución de la unidad de medida, en lugar de usar px (pixeles) a usar % (porcentajes)

    si quieres probar ese codigo css que te di el html es este:

    <html>
    <head>
    <title>Editado por Jenkins</title>
    <link rel="stylesheet" href="estilos.css" type="text/css" media="all">

    </head>
    <body>
    <div id="contenido">
    <div class="destacado">
    <p>esta es la primera parte</p>
    </div>
    <div class="menu">
    <p>esta es la segunda</p>
    </div>
    </div>
    </body>
    </html>

    Un saludo.
    Última edición por Jenkins; 04/03/2013 a las 13:52
    Aprende Como hacer una Boda utilizando varios pasos sencillos.

  5. #5
    Moderador CCTW Habitante Avatar de Yaneth
    Fecha de Ingreso
    27 abr, 07
    Ubicación
    Mèxico
    Mensajes
    10,344
    Poder de Reputación
    75
    hola
    creo que la mayoria de nosotros hemos tenido esta misma duda
    y sin embargo (la mayoria) regresa a los anchos fijos
    ya que utilizar porcentajes da mas dolores de cabeza que soluciones

    y te respondo, lo que me respondieron a mi, hace muuuuuuucho tiempo

    "como para que alguien va a hacer tanto zoom en una pàgina web?, si el texto es visible y claro, no tiene caso"

    al menos yo utilizo el ctrl +, solo cuando quiero apreciar los detalles de alguna imagen demasiado pequeña

    saludos
    ______________________________________

    reparacion de rines


    _____________________________________

Temas Similares

  1. Distintos navegadores....Distintos colores
    Por joseki en el foro Foro General
    Respuestas: 5
    Último Mensaje: 10/08/2012, 22:36
  2. DESORDEN EN NAVEGADORES!!!
    Por jurylicious en el foro Curso Paso a Paso con Html-Kit.
    Respuestas: 0
    Último Mensaje: 23/08/2010, 15:42

Etiquetas para este Tema

Permisos de Publicación

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