如何防止图像移动到div的边缘之外

Question

移动图像时出现问题 当浏览器调整大小时，图像移动到类col-md-6之外。

这是我的CSS和html：

#gradiente2 {
  background: rgba(43, 86, 162, 1.00);
  position: relative;
  padding: 0;
}

#img5 {
  position: relative;
  width: 3%;
  left: 434px;
  bottom: 74px;
  margin: 0;
  padding: 0;
  background-size: auto 0;
}

<div class="col-md-12" id="gradiente2">

  <p id="t1" class="typewrite" data-period="2000" data-type='[ "En nuestra institución siempre nos preocupamos por brindarte lo mejor"  ]'><span class="wrap"></span> </p>
  <p id="t2" class="typewrite" data-period="2000" data-type='[ "Síempre le Ponemos Corazón, a lo que hacemos" ]'><span class="wrap"></span> </p>

  <div id="movimiento">
    <img src="imagenes/kangura.png" class="img-responsive" id="img4">
    <img src="imagenes/corazon.png" class="img-responsive" id="img5">
    <button class="animar">Entregar Corazón</button>
  </div>

</div>

我做错了什么？请帮忙。

Answer 1

使用https://codepen.io/usefulthink/pen/LzprZj根据您的要求重新排列CSS。

在这个问题中，您必须更改

的值

{
    "Table1": [{
            "id": 0,
            "item": "item 0"
        },
        {
            "id": 1,
            "item": "item 1"
        }
    ]
}