Como alterar tamanho da imagem no mobile

Layout
9

Teste esse código:

@media only screen and (max-width: 767px) {
    .listagem .listagem-linha li .listagem-item,
    .listagem .produtos-carrossel .listagem-linha li .listagem-item {
        padding-top: 100%;
     }
    .listagem .listagem-item .imagem-produto{
        height: auto !important;
        padding-top: 100%;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
    }

       .listagem .listagem-item .imagem-produto img{
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

    .listagem .produtos-carrossel .listagem-linha li .listagem-item {
        margin: 0;
        padding: 0;
        padding-top: 100%;
    }

    /* Removendo a margem dos outros itens */
    .listagem .listagem-linha li{
        margin-top: 0;
    }
}

Eu até gravei esse processo mas foi tão rápido que nem agrega muita coisa. https://youtu.be/CdFStJwa4Ww

3 curtidas