jQuery如何设置div相对于另一个div的位置？

Question

我在html中有两个以下的div，

<div id="chart-2" class="graph"></div>
<div id="chart2Buttons"></div>

第一个div代表我使用highchart.js绘制的图形，而第二个代表我应该放在第一个div下面的按钮，如下图所示。

请问你能帮我怎样才能将第二个div放在第一个div的右下角？

由于

Answer 1

添加css规则：

#chart2Buttons {
    display: inline-block;
    float: right;
}

Answer 2

试试这个CSS：

#chart-2{
  position:relative;
}

#chart2Buttons{
   position:absolute:
   bottom:1px;
   right:1px;
}

Answer 3

在图表和按钮中添加一个包装器div，并将显示设置为内联块，并为包装器设置相对位置。将按钮置于绝对位置并将其置于底角，如下所示

.graph{
  width: 400px;
  height: 400px;
  background: crimson;
  line-height: 400px;
  text-align: center;
  color: white;
  font-size: 20px;
}

.wrapper{
  position:relative;
  display: inline-block;
}

#chart2Buttons{
  position: absolute;
  width: 40px;
  height: 40px;
  right: 0;
  bottom: 0;
  background: cornflowerblue;
  color: white;
  line-height: 40px;
  text-align: center;
}

<div class="wrapper">
  <div id="chart-2" class="graph"> GRAPH </div>
  <div id="chart2Buttons">B</div>
</div>