Pregunta sobre Arreglando WordPress de Wordpress:

Problema con Divs superpuestos

Un usuario preguntó 👇

Hola a todos,

Tengo el problema de que no puedo hacer clic en el menú de categorías de la izquierda cuando veo la página del producto solo para dispositivos móviles. Los enlaces del cuadro de categoría funcionan en todas las demás páginas y funcionan en la página del producto en el escritorio, pero no en el móvil.

Aquí hay un ejemplo: https://autoelecoz.com.au/product/dry-bag/

¿Sospecho que un div superpuesto está afectando la legibilidad?

Si alguien pudiera proporcionar una idea que sería genial, gracias.

Sam

(@ashwinparthasarathi)

Hace 10 meses, 3 semanas

Hola @ samd2020,

Recibí tu problema y, como mencionaste, se trata de superponer divs.

Específicamente, se trata de las clases bootstrap agregadas a la barra lateral y el contenido div principal.

las clases actuales son, para «lateral (barra lateral)» – barra lateral col-xs-12 col-sm-4 col-md-3 para «div (contenido principal)» – col-sm-8 col-md-9

el problema: el div de contenido principal se superpone porque no hay una clase col-xs- *.

la solución, cambiar las clases hasta ahora, para la barra lateral «lado (barra lateral») – col-xs-12 col-sm-12 col-md-3 para el «div (contenido principal)» – col-xs-12 col -sm-12 col-md-9

También agregué un cambio a las clases sm ya que no hay posibilidad de que las columnas 4: 8 funcionen en el rango del dispositivo «sm».

Además, mira https://developers.google.com/web/tools/chrome-devtools/remote-debugging sobre cómo depurar el navegador Chrome en dispositivos móviles.

(@ kartiks16)

Hace 10 meses, 3 semanas

Hola samd2020,

Añadiendo a lo que sugirió Ashwin, encontré el problema con las clases CSS y la Posición asignada.

Pruebe lo que Ashwin sugirió y háganos saber si eso ayuda.

Gracias.

(@ samd2020)

Hace 10 meses, 3 semanas

Gracias a ambos por el gran trabajo.

En esa página, ¿hay alguna manera de a) desplegar primero el cuadro de categoría? y b) ocultar las casillas de ‘envío el mismo día’ y ‘revendedor de redarc’ en un teléfono móvil solo en la página del producto? Intenté mostrar: none para las secciones @media, pero se eliminó de la página de inicio y otras páginas, así como de la página del producto.

Gracias de nuevo,

Sam

(@ashwinparthasarathi)

Hace 10 meses, 3 semanas

Hola @ samd2020,

Intente agregar una clase específica de página a su selector de CSS, algo como,
body.single-product .woo-cat-list { display:none; }

Esto asegurará que las propiedades CSS solo se apliquen a la página donde la clase CSS está disponible.

(@ samd2020)

Hace 10 meses, 3 semanas

Gracias Ashwin.

Agregué la línea .single-product .woo-cat-list {display: none;} (con la palabra body en el frente que no funcionó) con style.css debajo de una pantalla @media y (ancho máximo: 420px)

los oculta cuando los miro en la consola de depuración de Firefox después de agregar eso, pero en Google Chrome o en mi propio iPhone, ¿puedo seguir viéndolos?

Esta respuesta fue modificada hace 10 meses, 3 semanas por.

(@ashwinparthasarathi)

Hace 10 meses, 3 semanas

Si eso oculta los artículos en Firefox y aún puede verlos en Chrome o su iPhone, se trataría principalmente de almacenamiento en caché.

Intente verificar la ubicación en la ventana de incógnito / privada para confirmar que el problema está solucionado para los casos de Chrome y iPhone.

(@ samd2020)

Hace 10 meses, 3 semanas

todavía está presente en modo incógnito 🙁

(@ samd2020)

Hace 10 meses, 3 semanas

En realidad, funciona en modo incógnito en mi iPhone, pero no en el navegador de escritorio Chrome de incógnito. ¿Así que supongo que funciona?

¡Gracias, de nuevo, por toda su ayuda!

(@ashwinparthasarathi)

Hace 10 meses, 3 semanas

También creo que significa que el tema está resuelto.

Nos encantaría que marcara este tema como una solución. Esto ayuda a nuestros voluntarios a encontrar los problemas que necesitan atención y a que más personas obtengan ayuda, tal vez como lo hizo usted.

(@ samd2020)

Hace 10 meses, 3 semanas

gracias

¿Solucionó tu problema??

0 / 0

Deja una respuesta 0

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *