Vídeo no WordPress não se adapta à versão móvel

Antoniio1 · 12/09/2019

Hola, buenas. Tengo una página en WordPress y en ella hay un video que se muestra sin problemas en la versión web, al momento de abrir la página con el celular el video no se muestra y queda un espacio en blanco muy grande. Cómo hago para que se adapte al celular?
Esta es: https://jerseys.arrieta.mx/

El video si lo ven en la computadora sin problemas aparece, pero entrando al cel ya no se muestra.

Saludos.

YeltsinReyes · 12/09/2019

El vídeo esta en un div que tiene esta clase .elementor-hidden-phone,
lo cual oculta el vídeo cuando es una pantalla de móvil con display: none;

raul777 · 12/09/2019

Veo que estas usando Elementor, el problema es que el div en cuestion lo tienes oculto para telefonos moviles, lo siguiente es colocar el width con valor del 100% y debes ponerle un margin-top que permita desplazarlo un poco mas abajo porque queda oculto por el header con fondo cafe

Antoniio1 · 12/09/2019

.elementor-hidden-phone {
width: 100%
}

Coloco ese css en el css de WordPress pero sigue sin verse en móvil, es correcto colocarlo así?

raul777 · 12/09/2019

Tienes que cambiar el display tambien y mover el margin-top

Antoniio1 · 12/09/2019

raul777 disse:
Tienes que cambiar el display tambien y mover el margin-top

Por lo que veo el display puede ser solo block, inline y none que es el que actualmente está.
Soy malo con eso del css pero cada que actualizo e inspecciono elemento y lo pongo en modo móvil, sigue apareciendo la línea como al principio y no me aparece lo que modifiqué:

Inserir CODE, HTML ou PHP:

.elementor-hidden-phone {
width: 100%;
margin-top: 25px;
display: block;
}

raul777 · 12/09/2019

Si ves que no se modifica prueba ponerle !important

display: block !important;

Antoniio1 · 12/09/2019

De hecho, ya lo puse, mira:

Pero cuando le doy inspeccionar:

raul777 · 12/09/2019

Asi debe quedar

Antoniio1 · 12/09/2019

Lo sé, ya lo modifiqué pero no se generan cambios. De hecho lo modifiqué desde ftp y sigue igual

seba767 · 12/09/2019

Pues acabo de ver y si me aparece desde el celular 🙄

Antoniio1 · 12/09/2019

seba767 disse:
Pues acabo de ver y si me aparece desde el celular 🙄

Lo tendrás como "ver versión web" ? porque si entras así normal no se ve, lo he probado con 4 celulares distintos.

raul777 · 12/09/2019

Antoniio1 disse:
Lo tendrás como "ver versión web" ? porque si entras así normal no se ve, lo he probado con 4 celulares distintos.

Yo lo he modificado desde inspeccionar elemento, emulando un movil y se mira te he mandado la captura de pantalla. Si aun no logras hacerlo mandame un MP para entrar a la web yo y verlo a detalle

Antoniio1 · 13/09/2019

Hola, ya solucioné ese problema. Borré la caché y puedo verlo en el celular. El único problema ahora es que en mi celular, me aparecen elementos que oculté:

Y así se mira mi cel:

Pero, cuando inspecciono desde web, no se miran, ya está rara la cosa :c

raul777 · 13/09/2019

Esos elementos estan dentro del mismo div en Elementor, lo ideal seria crear otro div que tenga solo el video y que este se muestre solo en moviles y ocultas el otro.

La otra opcion es que le coloques una clase a cada uno de esos elementos y lo ocultes despues con CSS

Antoniio1 · 13/09/2019

Hola, encontré el elemento inspeccionando y coloqué "display: none", sí se borra en ese momento:

pero cuando entro al archivo y lo busco me aparecen muchos:

Ahí no sé en cuál ponerle el display none para que no se vea.

Saludos.

Vídeo no WordPress não se adapta à versão móvel

Antoniio1

YeltsinReyes

raul777

Antoniio1

raul777

Antoniio1

raul777

Antoniio1

raul777

Antoniio1

seba767

Antoniio1

raul777

Antoniio1

raul777

Antoniio1

Tópicos similares