Porque esta imagen не queda быстро реагирующий?

CSS Que esta mal en este?

.img-responsive{
  width: 100%;
  height: 100%;
  display:block;
}

.hovereffect {
  width: 100%;
  height: 100%;
  float: left;
  overflow: hidden;
  position: relative;
  text-align: center;
  cursor: default;
  padding-bottom: 2px;
  padding-top: 10px;
}

HTML

<div className="hovereffect">
        <img className="img-responsive" src={imgdir + item.img} alt={item.name}/>
            <div className="overlay">
                <h2>{item.name}</h2>
                <p> 
                    <b>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</b>
                </p> 
                <p> 
                    <a href="#">VIEW DEMO</a>
                </p> 
            </div>
    </div>

Море Necesito que la imagen realmente быстро реагирующий y никакой lo es, por ejemplo Комо mostrare чика continuacion si pongo una imagen mas que la azul, (la azul es la que anda bien y tiene un tamaño de 1100 x 620) se ve asi digamos queda mas главный que las.

introducir la descripción de la imagen aquí

1
задан 23.01.2017, 07:54
0 ответов

Ты протестировал следующее?

.img-responsive{
  max-width: 100%;
  height: auto;
}

С этим изображение было бы должно приспосабливаться в любое время к Вашему контейнеру.

1
ответ дан 03.12.2019, 17:37