2

defini um grid e dentro joguei uma imagem, essa imagem precisa ter uma altura de 150px, então defini assa altura a ela, o problema se deve ao fato da imagem estar ultrapassando o grid, não quero forçar um width de 100% com uma altura de 150px pois a imagem vai ficar borrada, como faço para dar um hidden na largura restante da imagem? tentei dar um overflow hidden mas não adianta, em baixo dessa imagem tem um h5 que por sinal pega a largura certa, só a imagem mesmo que esta com problemas, vejam print e parte do código: inserir a descrição da imagem aqui

Código:

<div class="col-md-2">
    <img src="images/produtos/rasp.webp" height="150">
    <h5><a href="#" class="linkProduto">Raspberry Pi Zero V 1.3 Com Conector P/câmera Pronta Entrega</a></h5>
</div>
2
  • Não seria melhor colocar a imagem no "background-image" e no CSS colocar um "background-size: cover" assim a imagem não perderia a proporção! Vale tentar. Commented 19/02/2017 às 1:10
  • o col-md está dentro de div class="row"?
    – Syzoth
    Commented 9/03/2017 às 0:09

1 Resposta 1

2

Galera consegui resolver da seguinte forma: Dei um overflow hidden dentro da tag que define o grid e não na imagem em si, dessa forma funcionou, vou mostrar como ficou:

<div class="col-md-2" style="overflow: hidden;">
    <img src="images/produtos/rasp.webp" height="150">
    <h5><a href="#" class="linkProduto">Raspberry Pi Zero V 1.3 Com Conector P/câmera Pronta Entrega</a></h5>
</div>

Espero ajudar as futuras pessoas com mesmo problema que tive.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .