Foros del Web » Creando para Internet » CSS »

Ajuste de resolución para móvil

Estas en el tema de Ajuste de resolución para móvil en el foro de CSS en Foros del Web. Hola, descargue una plantilla para modificarla y se cambia el formato cuando la abres en un telefono movil y quiero todo lo contrario, quiero que ...
  #1 (permalink)  
Antiguo 10/03/2014, 12:48
 
Fecha de Ingreso: marzo-2014
Mensajes: 27
Antigüedad: 10 años, 4 meses
Puntos: 0
Ajuste de resolución para móvil

Hola, descargue una plantilla para modificarla y se cambia el formato cuando la abres en un telefono movil y quiero todo lo contrario, quiero que se vea tal cual se ve en el pc. Por mas que miro el codigo y echo horas y horas no encuantro como quitar esa opcion sin que afecte al contenido. Por favor estoy desesperado. Muchas gracias, espero vuestra ayuda.
  #2 (permalink)  
Antiguo 10/03/2014, 14:38
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años
Puntos: 2114
Respuesta: ajuste de resolucion para movil

Bienvenido al foro.

Merlín, Harry Potter y Copperfield están de vacaciones. Así que sin código o al menos una URL poco más que dar palos de ciego se podrá hacer.
  #3 (permalink)  
Antiguo 10/03/2014, 17:25
 
Fecha de Ingreso: marzo-2014
Mensajes: 27
Antigüedad: 10 años, 4 meses
Puntos: 0
Respuesta: ajuste de resolucion para movil

Si alguien me hace el favor le podria mandar la web y que le eche un vistazo por que yo no doy con la tecla. Quien tenga un poco de tiempo que me lo diga y se la paso por mail. gracias.

Última edición por jrlsiles26; 10/03/2014 a las 17:32
  #4 (permalink)  
Antiguo 11/03/2014, 06:20
 
Fecha de Ingreso: marzo-2014
Mensajes: 5
Antigüedad: 10 años, 4 meses
Puntos: 1
Respuesta: ajuste de resolucion para movil

Puedes subirla a jsfiddle o alguna url...

Un saludo.
  #5 (permalink)  
Antiguo 11/03/2014, 07:06
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años
Puntos: 2114
Respuesta: ajuste de resolucion para movil

Aquí preferimos brindar ayuda de forma pública, no por privado. Es una cuestión comunitaria.
  #6 (permalink)  
Antiguo 11/03/2014, 16:00
 
Fecha de Ingreso: marzo-2014
Mensajes: 27
Antigüedad: 10 años, 4 meses
Puntos: 0
Respuesta: ajuste de resolucion para movil

Gracias por contestar, he intado poner el codigo aqui pero por alguna razon no me deja, evidentemente cuando tenga la solucion lo pondre para que al que le pase lo pueda solucionar. La pagina en cuestion es www.podologiagranada.com , si la abris con el movil vereis el cambio.
  #7 (permalink)  
Antiguo 11/03/2014, 16:21
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años
Puntos: 2114
Respuesta: ajuste de resolucion para movil

Pues lo que tienes que eliminar son las media-queries, que viéndolo por encima parece que solo tengas una en el archivo style.min.css (que tal vez venga de otro archivo, ya que ese está minificado).

Básicamente es borrar esto:

Código CSS:
Ver original
  1. @media only screen and (max-width:960px) {
  2.   /* aquí "dentro" hay varias reglas que también eliminarías */
  3. }
  #8 (permalink)  
Antiguo 11/03/2014, 19:28
 
Fecha de Ingreso: marzo-2014
Mensajes: 27
Antigüedad: 10 años, 4 meses
Puntos: 0
Respuesta: ajuste de resolucion para movil

Cita:
Iniciado por pzin Ver Mensaje
Pues lo que tienes que eliminar son las media-queries, que viéndolo por encima parece que solo tengas una en el archivo style.min.css (que tal vez venga de otro archivo, ya que ese está minificado).

Básicamente es borrar esto:

Código CSS:
Ver original
  1. @media only screen and (max-width:960px) {
  2.   /* aquí "dentro" hay varias reglas que también eliminarías */
  3. }
Ya lo he probado, es decir si en vez de 960 le pongo 10, se ve normar en el movil pero me lo desajusta todo y se ve enorme en el telefono. dentro de eso hay un monton de cosas, lo que pretendo es que ajuste en el movil con la pagina normal sin que varie nada.

Código CSS:
Ver original
  1. @media only screen and (max-width:960px){h2.orphan{margin:0 5% 20px;width:90%}.container{width:100%}header{background:0 0;padding-top:0}#logo{background:url(../images/light-pattern.png) transparent;border-bottom:1px solid #ccc;margin:0 0 20px;padding:10px 5%;width:90%;float:none;font-size:22px}.social-icons{display:block;float:none;position:absolute;right:5%;top:12px}nav{float:none;margin:20px 0}ul[role=navigation] li{float:none;display:block;margin:0 5% 5px;width:90%}ul[role=navigation] li a{padding:12px 20px;font-size:14px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px;position:relative}ul[role=navigation] li a:after{content:'';display:block;width:100%;height:100%;position:absolute;left:0;top:0;background:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(255,255,255,.4)),color-stop(50%,rgba(255,255,255,.15)),color-stop(50%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,0)));background:-moz-linear-gradient(center top,rgba(255,255,255,.4) 0,rgba(255,255,255,.15) 50%,rgba(255,255,255,0) 50%,rgba(255,255,255,0) 100%)}ul[role=navigation] li a .icon{font-size:22px;vertical-align:text-bottom}section[role=banner] hgroup h1,section[role=banner] hgroup h2{font:700 24px Helvetica,Arial,Tahoma;padding:0 5%;width:90%}section[role=banner] hgroup h2{font-size:16px;margin-top:15px}section[role=banner] article[role=main]{width:100%;padding:0 0 30px}section[role=banner] article[role=main] h2{line-height:1.2em}section[role=banner] article[role=main] .post,section[role=banner] article[role=main] aside{float:none;width:90%;margin:0 5%}section[role=banner] article[role=main] aside{display:none}section[role=banner] article[role=main] .price-table li{display:block}section[role=banner] article[role=main] .price-table li .button,section[role=banner] article[role=main] .price-table li h4,section[role=banner] article[role=main] .price-table li ul{display:none}section[role=banner] article[role=main] .price-table li .dark{margin:0;padding:15px 0 5px;-moz-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}section[role=banner] article[role=main] .price-table li.box{margin:0 5% 10px;width:90%;padding:0}section[role=banner] article[role=main] .price-table li.box .button{margin:10px 5% 0;width:90%}section[role=banner] article[role=main] .price-table li.box:first-child{padding:0 0 20px}section[role=banner] article[role=main] .price-table li.box:first-child .button,section[role=banner] article[role=main] .price-table li.box:first-child h4,section[role=banner] article[role=main] .price-table li.box:first-child ul{display:block}section[role=banner] article[role=main] .price-table li.box:first-child .dark{margin:0 0 10px;padding-bottom:0;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;border-radius:5px 5px 0 0}section[role=banner] article[role=main] .price-table li.gap{display:none}.button{width:100%;padding:15px 0;margin:0 0 15px}.left{float:none}.columns article{border:0!important;display:block;width:90%;padding:0;margin:0 5%;font-size:13px}.columns article figure{display:none}.columns article figure p{margin:0}.columns article figure img{width:100%}.columns article:first-child{padding:20px 0 10px}.columns article:first-child figure{display:block}.columns article:last-child h3{border:0}.thumb-rotator{padding:0 5% 20px}.thumb-rotator li{float:none;margin:0 0 5px;width:100%;display:none}.thumb-rotator li:first-child{display:block}.foo-slogan{overflow:hidden;padding:10px 5% 20px;width:90%}.foo-slogan h2{float:none;width:100%;font:700 22px/1em Helvetica,Arial,Tahoma;margin:0 0 15px}.foo-slogan .button{float:none}.c-form input[type=email],.c-form input[type=tel],.c-form input[type=text],.c-form textarea{padding:10px 3%;width:93%}.sort-bar{margin:0 5% 20px}.sort-bar a{line-height:24px}.thumb-list{margin:0 5%}.thumb-list li{height:auto!important;margin:0 0 20px!important;width:100%}.thumb-list li img{padding:2%;width:96%}.content,aside[role=complementary]{display:block;padding:10px 5%;width:90%}.content img,aside[role=complementary] img{max-width:90%}.content table,aside[role=complementary] table{width:95%}.content td,.content th,aside[role=complementary] td,aside[role=complementary] th{padding:2px 4px}footer[role=contentinfo]{padding:10px 5%;width:90%}footer[role=contentinfo] p{width:100%}}.oldies .columns{overflow:hidden}.oldies .columns article{float:left;display:block;width:21%}.oldies section[role=banner] article[role=main] .price-table{overflow:hidden}.oldies section[role=banner] article[role=main] .price-table li{float:left;width:215px}.oldies section[role=banner] article[role=main] .price-table li.gap{width:30px}.oldies section[role=banner] article[role=main] .price-table li .dark{width:215px}.oldies section[role=banner] article[role=main] .price-table li li{float:none}.ie7 aside[role=complementary]{float:left}.ie7 .content{width:680px;float:left}



este es el codigo, como lo puedo eliminar sin que me varie las cosas?. muchas gracias de verdad.

Última edición por pzin; 12/03/2014 a las 02:11
  #9 (permalink)  
Antiguo 12/03/2014, 02:16
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años
Puntos: 2114
Respuesta: ajuste de resolucion para movil

Bueno, es que si eliminas el código ese que pusiste no es eliminar lo que te dije, ya que ese código abarca más que la propia media-querie.

De todas formas, no sé si es porque estoy a primera hora de la mañana o qué, pero no entiendo muy bien que:

Cita:
Iniciado por jrlsiles26
se ve normar en el movil pero me lo desajusta todo y se ve enorme en el telefono
¿Móvil y teléfono no es la misma cosa?

De todas formas tendrás que quitar seguramente la meta-etiqueta viewport también, para que se normalice el ancho y no se autoajuste.

Etiquetas: ajuste, contenido, movil
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 02:25.