Eine Spalte auf Handy statt zwei Spalten

Question

Ich möchte Produkte auf Produktseiten in einer Spalte anzeigen, wenn mobil. Aber es zeigt zwei Spalten, und es kann zu Problemen führen, Apperance ich unter CSS-Code versucht, das zu tun, aber es hat nicht funktioniert:

@media only screen and (max-width:460px) { 
.woocommerce[class*=columns-] ul.products li.product { 
    width: 100%; 
} 
} 

Wo ich will, ist, dass;

http://www.e-tamirci.com/tamirci-bul/ 

Vielen Dank für Ihre Hilfe.

Ich habe die Lösung basierend auf Antworten gefunden;

@media all and (max-width:768px){ 
.woocommerce ul.products li.col-3.product, 
.woocommerce-page ul.products li.col-3.product{ 
    width: 98%; 
    margin:1%; 
} 

} 

Vielen Dank.

Answer 1

Ihr Problem ist

@media (max-width: 768px) 
.woocommerce ul.products li.col-3.product, .woocommerce-page ul.products li.col-3.product { 
    width: 48%; 
} 

es so ändern, um

@media (max-width: 768px) 
.woocommerce ul.products li.col-3.product, .woocommerce-page ul.products li.col-3.product { 
    width: 100%; 
} 

Answer 2

Bitte versuchen Sie folgendes css.Here Sie verpasst "" in col und u verwendet Spalten statt col

@media only screen and (max-width:460px) { 
.woocommerce[class*="col-"] ul.products li.product { 
    width: 100%; 
} 
}