Calificación:
  • 1 voto(s) - 5 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Duda con mediaquery en Wordpress [SOLUCIONADO]
#1
Pregunta 
Buenas a tod@s:

Hoy vengo con una duda de programación web.

Sé que se puede solucionar con media querys pero no encuentro la solución en la red. A ver si alguien por aquí domina el tema. Que seguro que lo encuentro, porque con lo frikis que sóis/somos....


Bueno, al caso. Estoy haciendo mi web profesional y en la página de servicios he puesto de lado 3 fotos y debajo de cada una de ellas el nombre del servicio al que linkan.

Si se mira en PC o tablet ningún problema, pero cuando se consulta a través de movil se descuadra todo. He probado de hacerlo con una tabla pero después no queda adaptado al tamaño del móvil y no me mola tampoco.

La solución es de pasar a tener las 3 fotos en horizontal ponerlas en vertical.

Sé que la solución pasa por utilizar mediaquerys, sin embargo, no sé por donde tirar. He tocado algo con bootstrap, pero muy senzillo. Y ahora estoy trabajando con Wordpress.


Muchas gracias de antemano.
Citar
#2
(13-10-2017, 04:59 PM)Electromecánico escribió: Buenas a tod@s:

Hoy vengo con una duda de programación web.

Sé que se puede solucionar con media querys pero no encuentro la solución en la red. A ver si alguien por aquí domina el tema. Que seguro que lo encuentro, porque con lo frikis que sóis/somos....


Bueno, al caso. Estoy haciendo mi web profesional y en la página de servicios he puesto de lado 3 fotos y debajo de cada una de ellas el nombre del servicio al que linkan.

Si se mira en PC o tablet ningún problema, pero cuando se consulta a través de movil se descuadra todo. He probado de hacerlo con una tabla pero después no queda adaptado al tamaño del móvil y no me mola tampoco.

La solución es de pasar a tener las 3 fotos en horizontal ponerlas en vertical.

Sé que la solución pasa por utilizar mediaquerys, sin embargo, no sé por donde tirar. He tocado algo con bootstrap, pero muy senzillo. Y ahora estoy trabajando con Wordpress.


Muchas gracias de antemano.

Hola Electromecánico,
si me envías enlace al sitio o el código te lo miro y lo arreglamos  Mola
Citar
#3
Hola @Electromecánico, no sé como lo tienes diseñado, pero creo que lo más acertado es usar una lista con los 
Código:
<ul>
  <li> </li>
</ul>

Las listas pueden incluir texto, imagenes, enlaces, etc y una de las ventajas que tienen es que las puedes poner en horizontal o en vertical...

Te recomiendo que mires el siguiente enlace: https://www.w3schools.com/css/css_navbar.asp en el que explican con detalle como hacer una lista y como ponerla en vertical u horizontal en función del css que le indiques.

Luego, como bien dices, con los mediaquery se aplicaría un estilo u otro en función de la resolución del dispositivo en el que se muestre el contenido.

En este enlace puedes ver ejemplos de como emplear mediaquery: https://www.w3schools.com/css/css_rwd_mediaqueries.asp

Pero para que lo tengas todo un poco junto, he preparado un ejemplo para ver si te sirve. Es una lista que cambia de horizontal a vertical en función del ancho de la pantalla. Mira este enlace: https://jsfiddle.net/wmkuLLjk/ y reduce el tamaño de la ventana del navegador para ver como cambia de una forma a otra.

Es un ejemplo muy sencillo, pero espero que te sirve de base para tu web, si necesitas algo mas en detalle, lo planteas por aquí y lo vemos.

Un saludo.
Citar
#4
Buenas a tod@s:

Muchas gracias vcode.

He puesto en práctica lo que me has comentado y ha funcionado. Estaba buscando la web que adjuntas, porque ya la conocía, pero no conseguía encontrarla.


Muchas gracias de nuevo
Citar


Temas similares...
Tema Autor Respuestas Vistas Último mensaje
Pregunta [SOL] Tengo dos URL's en el mismo servidor en wordpress como redirigir de uno a otro Electromecánico 5 389 02-03-2018, 12:04 PM
Último mensaje: Electromecánico
Exclamación Curso de Wordpress durante el mes de marzo Electromecánico 0 275 05-02-2018, 03:19 PM
Último mensaje: Electromecánico
Exclamación Problema menú wordpress [SOLUCIONADO] Electromecánico 4 595 26-11-2017, 07:20 PM
Último mensaje: Electromecánico
  ¿Cómo se quita la barra de título en Android? [SOLUCIONADO] Lord Bergidum 15 6,958 16-09-2014, 06:43 PM
Último mensaje: Lord Bergidum
  Disco duro "muerto" [SOLUCIONADO] ClioS 24 7,611 26-09-2013, 10:58 PM
Último mensaje: ClioS