Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola pessoal,estou tendo um problema no alinhamento na visualização dos produtos da minha loja virtual.
vou postar o exemplo ilustrada do problema que esta acontecendo.
Vou explicar:
a imagem e o nome do produto estao alinhando normalmente,o problema esta e quando eu seleciono frete gratis e uma promoçao ai o botao comprar nao alinha adequadamente exemplo.
Exemplo abaixo.
/applications/core/interface/imageproxy/imageproxy.php?img=http://uploaddeimagens.com.br/images/000/075/132/full/exemplo.png?1377824779&key=9f12cc06f5ecb820a82a1ae68b584a5b5be0ab35c444654ccb724a58f81a6449" alt="exemplo.png?1377824779" />
O primeiro exemplo e o erro e o segundo e como eu gostaria que ficasse.
Obrigado.
<style>.opacidade {filter:alpha(opacity=82); -moz-opacity:0.82; opacity:0.82;}.opacidade:hover {filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0;} .bordaVermelha {border-top-width: 1px;border-top-style: solid;border-top-color: #ccc;width:103%;} </style> <li class="%%GLOBAL_AlternateClass%%"> <hr class="bordaVermelha" /> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <td height="147" width="147"><div class="borda ; opacidade"> %%GLOBAL_ProductThumb%%<br /> <span class="Rating Rating%%GLOBAL_ProductRating%%"><img src="%%GLOBAL_IMG_PATH%%/IcoRating%%GLOBAL_ProductRating%%.gif" alt="" %%GLOBAL_ProductRatingImageDimensions%% style="%%GLOBAL_HideProductRating%%" /></span> </div></td> </tr> <tr> <td height="44"><div class="ProductDetails"> <strong><a href="%%GLOBAL_ProductLink%%">%%GLOBAL_ProductName%%</a></strong> </div> <div class="ProductPriceRating"> <em>%%GLOBAL_ProductPrice%%</em> </div></td> </tr> <tr> <td height="45"> <!--inicio--><div style="display:%%GLOBAL_HideActionAdd%%;">%%GLOBAL_FreteDestaques%%<br> %%GLOBAL_ProDestaques%%</div> <!--fim--></td> </tr> <tr> <td> <div class="ProductActionAdd" style="display:%%GLOBAL_HideActionAdd%%;"> <a href="%%GLOBAL_ProductURL%%"><img src="%%GLOBAL_TPL_PATH%%/img/comprar.gif" /></a> </div></td> </tr> </table> </li>
esta ai o codigo
Preciso resolver isso,ja tentei de tudo e nao vai
Obrigado a todos
e aproveitando o topico ja que postei o codigo,tem um pequeno errinho no nome e nao tem um limite se colocar o nome do produto exemplo
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
buga tudo pelo tamanho do nome, como que eu crio um limite para o tamanho do nome
exemplo:
camisa regata cor vermelha tamanho.....
alguem?
estudei mais o codigo e vi que o que esta causando esse erro e a promoçao
O frete e o botao comprar se nao colocar a promoçao eles alinham normalmente.
Esqueci de postar o css
/ listagem dos produtos /
.ProdutosListagem { margin:0; padding:0;}
.ProdutosListagem .ProductDetails a { font-size:14px; color:#3D5394; text-decoration:none; font-weight:bold;}
.ProdutosListagem li { list-style:none; float:left; color:#484747; width:33%; text-align:center; height:310px;}
.ProdutosListagem li strike { font-weight:normal; font-size:11px; font-weight:bold; color:#484747; float:left; width:100%; clear:inherit;}
.ProdutosListagem li em { font-style:normal; font-weight:bold; font-size:18px; color:#feb000; float:left; width:100% }
.ProdutosListagem li em b { color:#ed3006}
.ProdutosListagem li .Titulo a { color:#484747; text-decoration:none; font-weight:bold}
.MaisInfo { color:#0B2C4D;}
.FreteGratis { color:#e7b60a; text-transform:uppercase; font-size:10px;}
Exatamente o css do PROMOÇAO
.ProdutosListagem li strike { font-weight:normal; font-size:11px; font-weight:bold; color:#484747; float:left; width:100%;}
Consegui resolver o problema pessoal Inicial.
foi um erro vergonhoso :(
acabei nao dando espaço suficiente exigido pela promoçao e empurrava o frete gratis e logo em seguida comia espaço do COMPRAR e assim terminava tudo mal alinhado.
Mas valew patinha pela ajuda
Geralmente o "clear: both" resolve isso (colocando no botão comprar ou após, numa div). E vai precisar cutucar entre o clear e o float até acertar tudo (essa parte é chatinha mesmo).
Mas só adicionando seu código pro pessoal lhe ajudar melhor.