无法将图像放在图像上

Question

编辑:解决方案必备 display: inline-block;

我正在尝试将iframe放在图像上.但是,无论我将边距权限设置为什么,它都会保持在同一位置.约为背景图像的1/5.

HTML

<div class="backgroundimage">
  <img src="http://truespeed.ca/wp-content/uploads/2016/06/tvscreen.png" alt="null" />
  <iframe class="Youtube" width="479" height="269" src="https://www.youtube.com/embed/6ydYvG52K-E" frameborder="0" allowfullscreen></iframe>
</div>

CSS

.backgroundimage {
  display: inline-block;
  position: relative;
  top: 70px;
  bottom: 46px;
}
.Youtube {
  position: absolute;
  left: 280px;
  bottom: 46px;
  right: 380px;
}

还有我的问题图片:

Answer 1

只需更改left为.Youtube规则中较小的值(左侧是父元素的左侧).从大约10px开始,通过尝试找到理想的位置.

此外:您还必须清除的right: 380px;从你的.Youtube规则-它覆盖left规则(因为它遵循其下方("层叠")).