Modificação Mobile

Layout
1

ou alguem que possa me dar uma ajuda, por favor!
Ja tentei ajustar o botão “ver detalhes” no mobile de todas as maneiras (eu acho) possiveis, mas n consigo, ele teima em ir pro lado. seguem os codigos q colei (n sei se colei codigo demais tb) e uma imagem de como ficou no mobile e uma como eu gostaria q ficasse.

CODIGOS q eu fui futucando:
@media only screen and (max-width: 767px)
.acoes-produto-responsiva {
position: absolute;
top: 41%;
right: 61px
}
@media only screen and (max-width: 479px)
.acoes-produto-responsiva {
position: relative;
top: 44%;
right: 74px;
}
@media only screen and (max-width: 767px)
.acoes-produto-responsiva {
text-align: center;
}
@media only screen and (max-width: 767px)
.acoes-produto-responsiva .tag-comprar {
display: inline-block;
margin: 5px -10px 10px 0px;
line-height: 30px;
padding: -4px 12px;
}
@media only screen and (max-width: 479px)
.acoes-produto-responsiva .tag-comprar {
margin: 60px;
border-radius; 5px;
}

Imagem de como fica no mobile:

Como eu queria que ficasse:

2

alguma solução?também tenho o mesmo problema

3

Olá pessoa boa tarde, caso ainda não tenha resolvido o problema, o código acima esta correto porém você esqueceu de abrir e fechar as chaves do comando para o mobile, veja abaixo a diferença e o código correto com as chaves:

@media only screen and (max-width: 479px){
.acoes-produto-responsiva {
position: relative;
top: 44%;
right: 74px;
}
}

Espero ter ajudado… um abraço

1 curtida