[SOLUCIONADO] problema web adaptable

[candediez]

Buenas,
tengo una página con 5 secciones. Intento hacerla responsiva para dispositivos móbiles, pero no puedo lograr que en 4 secciones se vea bien. Me aparece como miniatura. He probado con meta "newport" y nada. En ocasiones, probando, termina haciendo que aparezca con un zoom excesivo. Sin embargo, una de las secciones SERVICES sí me aparece respetando el ancho de pantalla del móvil y tablet. No puedo encontrar la diferencia con el resto de las páginas! El sitio es [URL="http://www.blackbeltinspection.com.ar"]http://www.blackbeltinspection.com.ar[/URL] Muchas Gracias!

[xfxstudios]

acabo de revisarla y no se adapta por ningun lado, nisiquiera la seccion que indicas, el asunto es que debes trabajar com media querys para que esta sepa como se va a acoplar a cada pantalla, tambien jugar con DIVs yb los valores en tu css para lograr esto, verifique el css de tu pagina y no esta adaptado para hacer el sitio responsivo

[man0l0]

Hola, en primer lugar tu sitio tiene un ancho fijo y no tiene nada de responsive, la idea de que sea "responsive" es que al cambiar el tamaño del "viewport" (en pc el tamaño de la ventana), los estilos se adapten, muevan elementos, achiquen otros, etc.

Tu sitio tiene un ancho fijo y no responde a nada al cambiar el tamaño de la pantalla.

Por lo que entiendo lo que estás buscando que no te haga el "zoom out" (esto lo hace porque tu ancho de la página es mayor que el viewport de un móvil). Para esto puedes usar algunas etiquetas que puedes leer aquí: https://developer.mozilla.org/es/doc...wport_meta_tag

Saludos!

[candediez]

Muchas gracias por tu respuesta! disculpa que recién ahora puedo contestarte (es que estuve bastante enferma).

Estuve viendo lo que me mandas, intenté todas las versiones posibles pero no logro que el contenido se adapte al ancho del dispositivo.
Capaz me expresé mal, pero la idea no es tanto que sea responsiva, sino más bien que entre en el ancho del dispositivo. Y el problema es que: o me sale en miniatura, o si agrego viewport me agranda mucho y se ve una parte nomás. Por más que le de initial scale o maximum scale en 1. Quize ponerle un media queries y tampoco me ha funcionado

@media screen and (max-width: 800px) {
#wrap{
width:100%;
}
}
@media screen and (max-device-width : 480px) {
#wrap{
width:100%
}
}

[xfxstudios]

recuerda que las reglas no solo debes aplicarlas al contenedor principal, si no que debes tambien indicar cual va a ser el comportamiento de los demas elementos, es decir, si en determinadas pantallas no le aplicas el float:left a algunos div, estos van a estar fijos y por mas ancho al 100% que le des al contenedor, el navegador no va a saber que hacer con el resto y se vera igual o peor, ejemplo:

Código CSS:

<style>
 
 
@media screen and (max-width:480px){
    #wrap{
    width:100%;
}
#main_container{
    width:100%;
}
#header{
    display:none; /*ocultamos el menu alcual*/
}
#nav{
    display:block; /*mostramos el menu para movil o tablet*/
}
/*Resto de reglas para el menu movil*/
.home_section_dos{
    width:100%;
}
.home_title{
    font-size:16px;
    font-weight:bold;
    text-align:center
}
.home_section_dos p{
    font-size:12px;
    text-justify:auto;
}
}
</style>
 

aqui le decimos al navegador que va a hacer con los elementos si acceden desde un movil, como ver hay que indicar como van a estar organizados toooodos para que se cumpla lo responsive.

te recomiendo este sitio http://responsivetest.net/ para ir haciendo pruebas de tu css y visualizar como se vera la pagina en diferentes dispositivos

Saludos

[gran Wakka]

Iniciado por candediez

Capaz me expresé mal, pero la idea no es tanto que sea responsiva, sino más bien que entre en el ancho del dispositivo. Y el problema es que: o me sale en miniatura, o si agrego viewport me agranda mucho y se ve una parte nomás. Por más que le de initial scale o maximum scale en 1. Quize ponerle un media queries y tampoco me ha funcionado

Lo que comentas del viewport es el funcionamiento lógico.

Para hacerla responsiva hay que añadirle el viewport, y luego ir adaptando los tamaños de los elementos que necesites. Como bien te comentan no vale con modificar el ancho del contenedor principal.

Quizás, lo que deberías es contactar con un profesional. El diseño y la programación, si quieres un buen trabajo es mejor que te lo haga alguien que haya estudiado para ello.

En cualquier caso, suerte.

[candediez]

Muchas Gracias por sus aportes!
Saludos