Bom dia. Gostaria de alterar a posição dos campos (Frete grátis e desconto)
Ambos os campos estão na posição errada, estão acima do produto, gostaria de alterar a posição para baixo.
Tenta usar esse código:
.mega-recebe-prod > #listagemProdutos > ul > li > div > div.bandeiras-produto {
top: 90%;
}
Depois tenta adicionar mais produtos nessa seção para ver se o código serve para todos eles.
Será que conseguimos alterar o tamanho do produto?
Da uma olhada como ficou José.
Estranho José o meu está pequeno a imagem, forme o print que eu te enviei. Qual navegador você está utilizando? Até abri o Google Chrome em modo anônimo para ver se resolvia. Porem ele continua pequeno.
Estou no Google Chrome também.
Você tentou aumentar a resolução do seu navegador? A imagem parece diminuir de tamanho quando sua resolução não é grande o bastante para caber toda essa caixa.
Parece que em telas com alturas menores do que 660px, a imagem é redimensionada para ficar menor.
Achei o culpado para isso:
@media screen and (max-height: 660px)
.menu.superior #listagemProdutos.listagem .imagem-produto {
height: 100px;
}
José eu fiz a alteração porem continua da mesma forma.
Não sei dizer se é algo com o meu navegador, já que para voce está normal.
Tenta usar esse código para forçar a imagem a continuar com o tamanho original dela:
@media screen and (max-height: 660px) {
.menu.superior #listagemProdutos.listagem .imagem-produto {
height: 200px;
}
}
José o tamanho está perfeito.
Só mais um detalhe que eu gostaria de alterar. Quando eu passo o mouse em cima. O produto some e fica com esse aspecto do print. O botão comprar fica acima do outro.
Faz um teste com esse código:
/*Altera opacidade da imagem*/
.listagem .listagem-item:hover .imagem-produto.has-zoom .imagem-principal {
opacity: 0.4;
}
/*Altera posição do botão Comprar*/
#listagemProdutos.listagem .listagem-item .acoes-produto, .listagem.aproveite-tambem .listagem-item .acoes-produto {
top: 45%;
}
Aí você vai alterando o valor daquele top: 45%;
para deixar o botão na posição desejada.
José tá show. Agora só para finalizar, conseguimos fazer um ajuste na parte de baixo?
só para alinhar os campos. Gostaria de deslocar o campo frete para gratis um pouco para esquerda.
Naquele código que você já inseriu para alterar a posição desses 2 botões, acrescenta essa linha:
/*Alterar a posição dos campos oferas do dia, corrigi uma sobreposição dos campos - Frete gratis e desconto*/
.mega-recebe-prod > #listagemProdutos > ul > li > div > div.bandeiras-produto {
top: 90%;
right: 5px;
}
Aí é só alterar o valor do right: 5px;
para alinhar os dois botões.
Ficou perfeito José. Muito obrigado, mais uma vez.
José. O camando alterou tambem o local do botão comprar na pagina principal.
Será que é possivel alterar isso. Na pagina principal eu gostaria que o botão comprar ficasse a baixo dos valores.
Tenta atualizar esse código:
/*Altera posição do botão Comprar*/
.mega-recebe-prod > #listagemProdutos.listagem .listagem-item .acoes-produto, .listagem.aproveite-tambem .listagem-item .acoes-produto {
top: 45%;
}
Acrescentando esse trecho inicial .mega-recebe-prod >
o código deve se tornar exclusivo para o menu de ofertas.
Faltou deletar o código anterior, você está com os dois ativos:
/*Altera posição do botão Comprar*/
#listagemProdutos.listagem .listagem-item .acoes-produto, .listagem.aproveite-tambem .listagem-item .acoes-produto {
top: 45%;
}
/*Altera posição do botão Comprar*/
.mega-recebe-prod > #listagemProdutos.listagem .listagem-item .acoes-produto, .listagem.aproveite-tambem .listagem-item .acoes-produto {
top: 45%;
}
É só apagar o primeiro código que deve resolver esse problema.
Perfeito José. Deu certo aqui. Muito Obrigado.