html 表单内容和 css 对齐问题

Question

我有一个带有提交按钮和取消按钮的用户注册表单，

问题 1) 如果在带有 submit button 的表单中有取消按钮，当我单击取消按钮，它执行表单的操作而不是返回主页并取消注册页面。

我们不能将这两个按钮放在一个表单中吗？

问题 2) 由于问题 1，我在表单外添加了 cancel button 并链接到主页，它按我预期的那样工作，但是，我需要将这两个 按钮 放在屏幕的同一行中。

<div id="main-content">
    <div id="login-container">
        <form id="user-registration-form" method="POST">
            // Some other fields, like username, etc.
            <fieldset class="edit" id="submit-button-fieldset">

                <input type="submit" id="submit-regiser"/>

            </fieldset>

        </form>
        <fieldset id="Cancel-field">
          <button id='cancel-registration' onclick=window.location.href='link-to-home'>Cancel</button>
        </fieldset>
      </div>
  </div>

我需要将 #submit-regiser 和 #cancel-registration 放在屏幕的同一行中。而且这是针对移动浏览器的，所以应该遵守XHTML规则

提前致谢。

Answer 1

这是预期的行为。取消按钮应该清除表单，而不是让用户返回到之前的页面。

您仍然可以使用 <button> 以这种方式进行操作元素:

<form id="user-registration-form" method="POST">
    <fieldset class="edit" id="submit-button-fieldset">
        <button type="submit" id="submit-regiser">submit</button>
        <button id="cancel-regiser" onClick="window.location.href='http://example.com'; return false;">Back</button>
    </fieldset>
</form>