对齐一个表单和两个文本区域

我有一个包含32 * 50 TEXTAREA和提交按钮的表单。对齐一个表单和两个文本区域

现在我想水平对齐两个包含附加信息的文本区域。理想情况下，三个文本区域（用户可以输入/粘贴的文本区域和另外两个文本区域）应该具有相同的宽度，并显示在三个对齐的列中。

如果我想这样做，我应该只使用HTML？如果是这样，怎么样？一行一行三td？（样本代码将是最受欢迎的）。

或者你宁愿建议CSS？

2012-01-12 NoozNooz42

你可以粘贴你现在的代码，或者也许是一个jsfiddle？ – Undefined 2012-01-12 13:01:42

这是你需要的吗？ http://jsfiddle.net/FATfJ/ – itea 2012-01-12 13:06:56

@itea，为什么不发表你的评论作为答案，但直接与代码我的答案呢？ – systemovich 2012-01-12 13:13:24

textarea是内联元素，如果容器的宽度足够大，它们将水平对齐。所以，请参阅http://jsfiddle.net/FATfJ/我不知道这是否是您需要的。

代码：

<form id="a-form"> 
    <textarea></textarea> 
    <textarea></textarea> 
    <textarea></textarea> 
</form> 

#a-form textarea {width: 100px;}

2012-01-12 13:17:21 itea

woaw。给所有人+1 ... jsfiddle似乎摇滚很多！是的，这似乎是我所追求的。能够直接在jsfiddle中看到结果是非常好的！ – NoozNooz42 2012-01-12 16:47:40

理想情况下，您需要CSS和HTML的完美组合。你也许可以使用fieldset来放置你的字段，然后使用CSS将它们彼此相邻放置。你可以使用CSS设置宽度和边距等，你应该能够以这种方式排列所有东西。

你可以使用表来做到这一点，但我发现他们可以添加比真正需要的更多的代码。

2012-01-12 13:09:09 matpol

由于textarea是一个内联元素，你可以把接连不断这样的元素。如果它们适合它们，它们将在一行中出现，但如果需要的话，则将它们包裹到两行或三行。

如果您在横向空间不足时强制水平滚动，则可以使用单行表。标记没有什么特别之处：

<table><tr><td><textarea ...></textarea> 
      <td><textarea ...></textarea> 
      <td><textarea ...></textarea> 
</table>

但是，如果您希望微调渲染，那么最好用CSS来完成。

如果textarea元素需要标签，就像通常那样，您可以将它们放在表格的另一行中（在其开始处）。

2012-01-12 13:22:01

回答