html - 如何在标题(H1、H2 等)标签中定位元素？

Question

这看起来应该很简单，但它让我抓狂!!

我需要能够将按钮或其他输入元素放置在标题元素的右侧，该元素还包含文本。

基本标记是:

<h3>Order Details  <input type="button" value="Refund" id="btnRefund"  /></h3>

期望的结果是文本“Order Details”位于 H3 元素的左侧，按钮位于右侧。显而易见的解决方案是向按钮添加 align:right，但这会导致按钮出现在 H3 元素之外或不与文本内联。

我尝试了 H3 元素上 position 属性的各种组合，并将文本包装在 div 和 span 标签中。

当我得到解决方案时，我肯定会踢自己。

编辑/更新:我坚持 nickf 的回答(无论如何现在)，因为我正在处理一个相当旧的系统，其中 H3 已经在外部样式表中设置了样式，包括背景颜色等。还有许多 H3 标签的实例被使用而没有任何进一步的元素嵌套在其中，对我来说，复制 H3 标签样式的 div 标签来容纳它是没有意义的。

如果我从头开始，我可能会考虑 Mark 的回答。

Answer 1

你必须把它放在第一位

<h3><input type="button" style="float: right">Order Details</h3>