Html 如何在不更改父级显示样式的情况下水平对齐两个按钮

我需要在一个h2元素中有两个buttons元素，我希望两个按钮在同一行，水平对齐，而不是一个在另一个上面，标题和它们之间有一些空白，但我不想更改h2父级显示或样式，还有什么其他方法可以实现这一点？可能吗

.btn{ 显示：内联块； 填充：8x16px； 光标：指针； 过渡时间：500ms； 文本对齐：居中； 垂直对齐：中间对齐； 空白：nowrap； 大纲：无； 行高：继承； 背景色：透明； 边框：1px纯黑； 颜色：黑色； 字体大小：16px； 字母间距：2px； } .btn小型{ 填充：4px16px； } 惊人的标题 小心 登记 您可以在类中使用或添加float:left.btn

---

检查此小提琴：

更改HTML并将两个按钮都放在.video div中

粘虫{ 文本对齐：居中； } .btn{ 显示：内联块； 填充：8x16px； 光标：指针； 过渡时间：500ms； 文本对齐：居中； 垂直对齐：中间对齐； 空白：nowrap； 大纲：无； 行高：继承； 背景色：透明； 边框：1px纯黑； 颜色：黑色； 字体大小：16px； 字母间距：2px； 边缘顶部：1米； } .btn小型{ 填充：4px16px； } 惊人的标题 小心 登记 FLoat：FLoat属性指定元素是否应该浮动

只需在css中添加float属性

.btn--small {
    float:left;
    padding: 4px 16px;
}

我需要在一个h2元素中有两个buttons元素，我希望两个按钮在同一行，水平对齐，而不是一个在另一个上面，标题和它们之间有一些空白，但我不想更改h2父级显示或样式，还有什么其他方法可以实现这一点？可能吗？ .btn{ 显示：内联块； 填充：8x16px； 光标：指针； 过渡时间：500ms； 文本对齐：居中； 垂直对齐：中间对齐； 空白：nowrap； 大纲：无； 行高：继承； 背景色：透明； 边框：1px纯黑； 颜色：黑色； 字体大小：16px； 字母间距：2px； } .btn小型{ 填充：4px16px； } 惊人的标题 小心 登记 整版 .btn{ 显示：内联块； 填充：8x16px； 光标：指针； 过渡时间：500ms； 文本对齐：居中； 垂直对齐：中间对齐； 空白：nowrap； 大纲：无； 行高：继承； 背景色：透明； 边框：1px纯黑； 颜色：黑色； 字体大小：16px； 字母间距：2px； 边缘顶部：1米； } .btn小型{ 浮动：左； 填充：4px16px； } .按钮组{ 显示：内联flex； } 惊人的标题 小心 登记 谢谢，我正在动态添加.video div，所以它有时可能不存在，如果它不存在，我无法将其中一个按钮放在该按钮内。我现在要做的就是为h2中的按钮添加另一个div元素。我给了这个新的div display:inline flex，但现在，在某些屏幕尺寸下，按钮与h2上的文本（而不是下面的文本）显示为内联，我尝试给h2元素提供display:block，但没有成功。我已经添加了一个新的代码段，我现在正在尝试这样做