html - 我想在同一行并排的 2 个 HTML 按钮

Question

我有 2 个 HTML 按钮，我希望它们与第一个（提交请求）按钮并排在同一行上。我遇到的问题是第二个按钮的顶部从底部按钮的底部开始。由于 margin-left: 50px 元素，第二个按钮正确地向右移动。我列出了下面 2 个按钮的 HTML：

<button style="float: left;" onclick="javascript:submitRequests();">
    Submit Request(s)
</button>
<button style="float: left; margin-left: 50px" 
        onclick="javascript:document.location.reload(true);">
    Reset
</button>

Answer 1

在使用 Codepen 或 JsFiddle 添加您的代码或想法之前尝试一下。

我建议你看看我对这个解决方案的建议：http: //cdpn.io/uKLga

您会发现它很简单，您只需添加 2 个类并定义此按钮类型（提交和重置），这些类可帮助您按站点进行格式化。

Answer 2

这应该可以解决问题：http: //jsfiddle.net/cau4t/

<div class="container">
    <button onclick="javascript:submitRequests();">Submit Request(s)</button>
    <button onclick="javascript:document.location.reload(true);">Reset</button>
</div>

.container {
    overflow: hidden;
}

button {
    float: left;
}

button:first-child {
    margin-right: 50px;
}

Answer 3

事实证明，我所要做的就是摆脱 2 个按钮之间的空间，现在它们不再偏移。这是在一个 Drupal 网络表单中，它似乎对额外的空间很挑剔。