如何在.row下的两个div之间添加图像（使用bootstrap 4）答案

【问题标题】：how to add image between two divs under .row (using bootstrap 4)如何在.row下的两个div之间添加图像（使用bootstrap 4）
【发布时间】：2020-03-06 16:13:17
【问题描述】：

这是我的代码：

<div class="row"style="">
  <div class="panel panel-success col-sm-3" style="background-color: #d16b55; ">
    <div class="panel-body" style="height: 1000px; margin-left: 50px;overflow: hidden !important;">   
      <img class="card-img-top" src="movie_poster/sonic-the-hedgehog.jpg " alt="Card image" style="height:370px;width:100%;margin-top:15px;position: absolute;left: 50px;overflow: visible;">
    </div>
  </div>
  <div class="panel panel-success col-sm-9 " style="background-color: #ffe2db;"><div class="panel-body"></div></div>
</div>

请检查此图片我 100% 确定一半图像隐藏在第二个 div 后面。删除第二个 div 时可以看到。

【问题讨论】：

我想帮助你，但是，如果没有看到一些代码，我无能为力。图像对任何人都没有帮助。请发布您的代码或类似 JSFiddle 的内容。
对此感到抱歉。你现在可以看到代码了！

标签： html css bootstrap-4

【解决方案1】：

最后加载的图像将“在顶部”，但是如果您的 div 的边距值为正，则您的内容不应重叠。

【讨论】：

【解决方案2】：

这是一个分层问题，放在两个 div 之后效果很好

check this

代码：

 <div class="row"style="margin-top: 10px;">
      <div class="panel panel-success col-sm-3" style="background-color: #d16b55; ">
        <div class="panel-body" style="height: 1000px; margin-left: 50px;overflow: hidden !important;">   

        </div>
      </div>
      <div class="panel panel-success col-sm-9 " style="background-color: #ffe2db;"><div class="panel-body"></div></div>
      <img class="card-img-top col-sm-3" src="movie_poster/sonic-the-hedgehog.jpg " alt="Card image" style="height:370px;width:100%;margin-top:15px;position: absolute;left: 100px;">
    </div>

【讨论】：