Question

这不起作用

<form style ='display:inline;'>
 <input type = 'submit'/>
</form>
<form style ='display:inline;'>
  <input type = 'submit'/>
</form>

我想要两个提交到不同脚本的表单，每个表单都有一个输入按钮来显示内联。

我想将其设置为内联样式，因为其他人会对主要CSS文件进行更多永久性更改，我做错了什么？

Answer 1

我认为你想要的是并排显示它们。您可以使用浮点数来执行此操作，如下所示：

<form style ='float: left; padding: 5px;'>
akjfhdkjahj<br />
 <input type = 'submit'/>
</form>
<form style ='float: left; padding: 5px;'>
  aklfjas<br />
  <input type = 'submit'/>
</form>

但即便如此也不理想。什么是最好的是包装每个＆lt;形式＆gt;在＆lt; div＆gt; s并在div标签中使用float。

Answer 2

如果我理解正确，您可以使用display:inline-block;

form{
    width:200px;           //JUST FOR SHOW
    height:200px;          //JUST FOR SHOW
    background:red;        //JUST FOR SHOW
    display:inline-block;  
    margin:1em;            
}

示例： http://jsfiddle.net/jasongennaro/dn5NQ/3/

显然，你需要重新修改表格的内容......正如你所说。

Answer 3

显示内联的输入按钮

如果按钮应以内嵌方式显示，则需要将这些样式分配给输入，而不是表单。

Answer 4

您应该为您的属性使用引号"，并设置按钮inline的样式，以及默认情况下定义为block。

Answer 5

只需使用 display:inline-block 。示例：

<form style ='display:inline-block;'>
 <input type = 'submit'/>
</form>
<form style ='display:inline-block;'>
  <input type = 'submit'/>
</form>

并且您也可以使用 HTML Table 来强制执行此操作。示例：

<table>
  <tr>
     <td>
       <form>
         <input type="submit" />
       </form>
     </td>
     <td>
       <form>
         <input type="submit" />
       </form>
     </td>
  </tr>
</table>

获取两个表单以显示内联

5 个答案: