css - 相对于图像的位置按钮

Question

我希望能够有一个相对于图像定位的按钮。我为我正在尝试做的事情制作了一个 jsfiddle。

https://jsfiddle.net/a1e1vb1n/

我的期望是按钮会随着图像移动，但正如您所看到的那样 =(

HTML:

<div id="container">

<div id="parent">
    <img src="http://i.imgur.com/wsNrRVQ.jpg" width=200px height=200px>
</div>

<div id="child">
    <button>
    Click Me
    </button>
</div>

CSS:

#container {
  position: relative;
}

#parent {
  position: absolute;
  left: 200px;
}

#child {
  position: absolute;
}

Answer 1

试试这个-

<div id="container">

 <div id="parent">
    <img src="http://i.imgur.com/wsNrRVQ.jpg" width=200px height=200px>
    <div id="child">
      <button>
      Click Me
      </button>
    </div>
 </div> 
</div>