html - 将按钮粘贴到 div 的右侧

Question

http://jsfiddle.net/kn5sH/

我需要添加什么才能将按钮粘贴到 div 的右侧，与标题在同一行？

HTML:

<div>
    <h1> Ok </h1>
    <button type='button'>Button</button>
</div>

CSS:

div {
    background: purple;
}

div h1 {
    text-align: center;
}

div button {
}

更具体地说:

1. 按钮的右侧应与右侧相距 x 像素 div 的边缘。
2. 它应该与标题在同一行。
3. 应该包含在 div 中(比如 float 或 relative 定位在视觉上将其从 div 中弹出)

可以使用哪些 CSS 技术来做到这一点？谢谢。

Answer 1

通常我会建议 float ，但根据您的 3 个要求，我建议这样做:

position: absolute;
right: 10px;
top: 5px;

不要忘记 position: relative; 在父 div 上

DEMO