Html 显示多个表单提交按钮在表格中的 IE8 中内联同一行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/1266734/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Display Multiple Form Submit Buttons Inline Same Line In IE8 In Table
提问by aherrick
I am trying to display two form submit buttons on the same line inside a table. In IE7 the following code works great, however in IE8 the Delete button drops down to the next line even though I declared the form to display inline. Any suggestions?
我试图在表格内的同一行上显示两个表单提交按钮。在 IE7 中，以下代码效果很好，但是在 IE8 中，即使我声明表单要显示内联，删除按钮也会下降到下一行。有什么建议？
I created a basic test page here to show the issue: http://ajondeck.net/test/displayinline.html
我在这里创建了一个基本的测试页面来显示这个问题：http: //ajondeck.net/test/displayinline.html
采纳答案by cletus
Your example doesn't work primarily because your HTML isn't valid. You open a td, put Submit1 and then close a form element?? Fix that and a lot of problems probably go away.
您的示例不起作用主要是因为您的 HTML 无效。你打开一个 td，把 Submit1 然后关闭一个表单元素？？解决这个问题，很多问题可能会消失。
If you want two buttons side by side, you should just be able to put them in the same container.
如果你想要两个按钮并排，你应该能够将它们放在同一个容器中。
回答by Ramon
Try the following because I had a situation where I made that work without tables and stuff.
尝试以下操作，因为我遇到过这样的情况，我在没有表格和其他东西的情况下完成了这项工作。
//Put this in ur css styling area
.spanFormat
{
text-align: left;
display: table-cell;
min-width: 10px;
padding-right: 10px;
}
//This is the html that is used to make ur input buttons side by side on two
//different forms.
<span class="spanFormat">
<form action="someaction.php" method="post">
<input type="submit" name="action1" value="somevalue" />
<input type="hidden" name="param" value="somevalue" />
</form>
</span>
<span class="spanFormat">
<form action="someaction2.php" method="post">
<input type="submit" name="action3" value="somevalue" />
<input type="hidden" name="param1" value="somevalue" />
</form>
</span>
That seemed to put both of my buttons on two different forms side by side.
这似乎将我的两个按钮并排放在两种不同的形式上。
回答by CFDub
The easiest way I find is to use a little inline CSS (you could list it as a class in your stylesheet as well if you'd like) in the form tag, like so:
我找到的最简单的方法是在表单标签中使用一些内联 CSS（如果您愿意，也可以将它列为样式表中的一个类），如下所示：
<form method="post" action="nextPage.html" name="nameForm" style="display:inline;">
<input type="hidden" name="value" value="someValue">
<input type="submit" name="submit" value="Submit">
</form>
回答by tguillea
put each form in their own TD.
将每个表单放在自己的 TD 中。
ex:
前任：
<table cellpadding="0" cellspacing="0">
<tr><td>
<form action="action.php" method="post" style="padding: 0; margin: 0">
<input type="submit" value="Submit" name="X1">
</form>
</td><td>
<form action="action.php" method="post" style="padding: 0; margin: 0">
<input type="submit" value="Submit" name="X2">
</form>
</td></tr></table>
etc.
等等。
Edit: Just to be totally clear, you can also do this with one form enclosing the entire table. On the next page (i.e. action.php in the above code), you can do something like:
编辑：为了完全清楚，您也可以使用一个包含整个表格的表格来执行此操作。在下一页（即上面代码中的 action.php），您可以执行以下操作：
if ($_POST['X2'] == 'Submit'){
//do stuff
}
Another tactic (if you have multiple forms) is to include hidden input elements and test for the values of those, but often you just need to know what button the user pressed, which is what the above code does.
另一种策略（如果您有多个表单）是包含隐藏的输入元素并测试这些元素的值，但通常您只需要知道用户按下了哪个按钮，这就是上面的代码所做的。
回答by Santi
If you want a quick solution you should enlarge the size of the td using css.
如果你想要一个快速的解决方案，你应该使用 css 放大 td 的大小。
<td style="width:300px">
<input id="Submit1" type="submit" value="Submit" name="Submit1"/>
<form id="form2" action="www.test.com/test2" method="post" name="form2">
<input id="Delete" type="submit" value="Delete" name="Delete"/>
</form>
But the important thing here is that this kind of form is awfully coded man. Try to read about divs and css, tables are your worst enemy!
但这里重要的是，这种形式是非常编码的人。尝试阅读 div 和 css，表格是你最大的敌人！
Hope you find this useful: http://www.cssdrive.com/index.php/examples/exampleitem/tableless_forms/P30/
希望你觉得这很有用：http: //www.cssdrive.com/index.php/examples/exampleitem/tableless_forms/P30/
回答by Kirby L. Wallace
There's nothing wrong with using tables for layout. I think that whole "anti-table" crowd are just a bunch of 3l33t1st snobs. ;-) Tables are universally supported in ALL browsers. They are from ancient days. They are stable. The are properly rendered by all browsers.
使用表格进行布局并没有错。我认为整个“反桌”人群只是一群 3l33t1st 势利小人。;-) 所有浏览器都普遍支持表格。他们来自远古时代。他们很稳定。由所有浏览器正确呈现。
divs and spans are not. There are significant differences between ie, ff, opera, safari, etc over how things like css styles (such as "padding" or "margins") are played out in the rendering of the page.
div 和 span 不是。ie、ff、opera、safari 等之间存在显着差异，比如 css 样式（例如“填充”或“边距”）在页面渲染中的表现方式。
About your question:
关于你的问题：
An [input type=submit] outside of a form will do nothing. If you want a button outside a form, you might try playing with "type=button" and see where that gets ya. You'll probably need to script a javascript action to make it do your nefarious bidding! ;-)
表单外的 [input type=submit] 将什么也不做。如果你想要一个表单外的按钮，你可以尝试使用“type=button”，看看它在哪里。您可能需要编写一个 javascript 操作脚本以使其执行您的恶意投标！;-)
The other thing you might try is clearing the form's margin (by default, forms have noticeably large margins) and also try floating the FORM (ie, style="margin:0px;float:right;") or so....
您可能尝试的另一件事是清除表单的边距（默认情况下，表单的边距明显较大）并尝试浮动 FORM（即 style="margin:0px;float:right;") 左右......
