如何把两个按钮放在相同的水平对齐

How to put two buttons on the same horizontal alignment?

本文关键字：对齐 水平 按钮 两个      更新时间：2023-09-26

我正在用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>";
顺便说一下，它看起来很乱:)人们通常怎么做这种事情，使它更干净?

谢谢!

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>";

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

现在，在有人攻击我使用clear:both…

你可以用两种方法解决这个问题:1)使用有两列的表，一列包含第一个按钮，另一列包含第二个按钮。2)你也可以使用margin-top style的值为负值

相关文章：