javascript - 如何将两个按钮放在同一水平线上？

Question

我正在用 JavaScript 制作一个 HTML 表单并且它可以工作，但是两个按钮:取消和提交位于不同的行上(一个在另一个之上)。如何使它们水平对齐？

这是我的代码:

var new_comment_form = "<form id='add_comment' method='post'><textarea name='problem_comment' cols=60 rows=6 id='problem_comment'>" + problem_comment_text + "</textarea><input type='hidden' id='problem_id' name='problem_id' value='" + problem_id + "' /><input type='hidden' id='problem_comment_id' value='" + problem_comment_id + "' /><input type='submit' class='button' value='Edit Message' /><input type='button' class='button' id='cancel_comment' data-problem_id='" + problem_id + "' value='Cancel' /></form>";

顺便说一句，它看起来很乱 :) 人们通常如何做这种事情才能使它更干净？

谢谢!

Answer 1

http://jsfiddle.net/G2qsp/1/

据我所知，他们在同一条线上:P

使它更简洁的常规方法(至少，我这样做)是将它放在新的行中，每行末尾带有 +。

又名:

var new_comment_form = 
"<form id='add_comment' method='post'>"+
  "<textarea name='problem_comment' cols=60 rows=6 id='problem_comment'>"+
      problem_comment_text +
  "</textarea>"+
  "<input type='hidden' id='problem_id' name='problem_id' value='" + problem_id + "' />"+
  "<input type='hidden' id='problem_comment_id' value='" + problem_comment_id + "' />"+
  "<input type='submit' class='button' value='Edit Message' />"+
  "<input type='button' class='button' id='cancel_comment' data-problem_id='" + problem_id + "' value='Cancel' />"+
"</form>";

编辑: 如果您仍然遇到一些对齐问题，这就是您想要对 float 进行的大致操作 http://jsfiddle.net/G2qsp/2/

现在，在有人攻击我使用 clear:both 之前逃跑......