在同一行上对齐html输入

Question

有人可以提供一个简单的解决方案,如何在同一行上对齐表单输入,例如,当我构建一个表单时,我可以让它们在彼此的顶部对齐,它看起来很合理,但如果我放两个输入像textarea/text旁边的另一个文本或按钮,我得到垂直对齐差异.有没有办法解决这个问题,而不是摆弄边距和填充？

例如:

<style type='text/css'>
  form{
    display:inline;
  }
  textarea{
    font-size:25px;
    height:25px;
    width:200px;
  }
  input.button{
    height:25px;
    width:50px;
  }
</style>
<form>
  <textarea >Value</textarea><input type='button' class='button' value='Go'>
</form>

Answer 1

你尝试过使用vertical-align css属性吗？

vertical-align:top;

这样一切都会保持一致,你不必使用边距.

Answer 2

textarea,input.button{display:inline-block;}

要么

textarea,input.button{float:left;}

根据你垂直挑战的方式挑选你的选择