Avisos
Vaciar todo

[Resuelto] Celda vacia en grid de productos

4 Respuestas
2 Usuarios
0 Reactions
12 Visitas
Respuestas: 146
Estimable Member
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Buenas, al cambiar el css en versión móvil en la pagina de marcas me deja la primera vacía, en tablet y escritorio sale bien.

ejem: Katia archivos - Mercería Ninot

código que añadí en apariencia - personalizar

 

/* --- SOLO MÓVILES ≤780px: 2 columnas, impar al final --- */

@media (max-width: 780px) {

  body.tax-product_tag ul.products,

  body.tax-product_brand ul.products {

      display: grid !important;

      grid-template-columns: repeat(2, 1fr) !important; /* siempre 2 columnas */

      gap: 8px !important; /* espacio entre productos */

      width: 100% !important;

      margin: 0 !important;

      padding: 0 !important;

  }

 

  body.tax-product_tag ul.products li.product,

  body.tax-product_brand ul.products li.product {

      width: 100% !important; /* ocupa toda la celda */

      box-sizing: border-box !important;

      margin: 0 !important;

  }

}

Contenido solo visible a usuarios registrados


 
Respondido : 08/03/2026 6:22 pm
Karen Rios
Respuestas: 20081
Illustrious Member Moderator
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Hola Pedro, 

Es posible que el error sea porque al convertir ul.products en grid los pseudoelementoes ::before y ::after que WooCommerce o el propio tema usa como clearfix tambein entran al grid, esto hace que el ::before ocupe la primera celda vacia y por ello el primerp productos real se ve en la segunda columna en movil, para solucionarlo reemplaza este codigo que nos indicas por el siguiente:

/* --- SOLO MÓVILES ≤780px: 2 columnas --- */
@media (max-width: 780px) {

body.tax-product_tag ul.products,
body.tax-product_brand ul.products {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 8px !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}

/* Evita que los clearfix del tema ocupen una celda del grid */
body.tax-product_tag ul.products::before,
body.tax-product_tag ul.products::after,
body.tax-product_brand ul.products::before,
body.tax-product_brand ul.products::after {
content: none !important;
display: none !important;
}

body.tax-product_tag ul.products li.product,
body.tax-product_brand ul.products li.product {
width: 100% !important;
max-width: 100% !important;
margin: 0 !important;
box-sizing: border-box !important;
float: none !important;
clear: none !important;
}
}

Verificalo y nos comentas si con ello el grid se visualiza de forma correcta en movil. 

Un Saludo


 
Respondido : 08/03/2026 10:14 pm
Respuestas: 146
Estimable Member
Topic starter
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Buenas, funcionando, daros las gracias a todos por vuestra paciencia, ha costado varios temas pero lo hemos conseguido, gracias


 
Respondido : 09/03/2026 4:10 pm
Karen Rios
Respuestas: 20081
Illustrious Member Moderator
Translate
English
Spanish
French
German
Italian
Portuguese
Russian
Chinese
Japanese
Korean
Arabic
Hindi
Dutch
Polish
Turkish
Vietnamese
Thai
Swedish
Danish
Finnish
Norwegian
Czech
Hungarian
Romanian
Greek
Hebrew
Indonesian
Malay
Ukrainian
Bulgarian
Croatian
Slovak
Slovenian
Serbian
Lithuanian
Latvian
Estonian
 

Hola Pedro, 

Enhorabuena ha funcionado como necesitas, es un placer para nosotros siempre poder ayudarte. 

No dudes en escribrinos si tienes cualquier otra consulta. 

Un Saludo 😊 


 
Respondido : 09/03/2026 4:37 pm