如何将文本区域字段与 html 表单中文本框字段的宽度对齐？
我正在设计一个网页表单，其中有几个文本框和文本区域字段，并注意到这些字段存在某些对齐问题。
代码如下 -
<textarea rows="4" cols="30" name="details"></textarea>
<input type="text" name="username" size="30"></input>
尽管两个字段的 col 宽度都设置为 30，但我看到文本区域宽度超出了文本框的宽度。我对textarea字段使用了overflow:hidden，然后尝试使用将cols属性设置为25、26等来调整它的大小，但仍然看到对齐方式并不完美（尽管非常接近）。
问题 - 是否有更好的方法来对齐表单中的所有字段，使其具有 30 列的标准宽度？
i was designing a webpage form which has couple of textboxes and textarea fields in it, and noticed that certain alignment issues with these fields.
The code is as below -
<textarea rows="4" cols="30" name="details"></textarea>
<input type="text" name="username" size="30"></input>
Although both fields have col width set to 30, i see that the textarea width extends over the width of the textbox. I used overflow:hidden using css for the textarea field, and then tried resizing it using the cols property set to 25, 26 etc.., but still see that the alignment is not perfect (though very close).
Question - Is there a better way to align all the fields in the form to have a standard width of say 30cols?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
使用 CSS 来设置元素样式是通常的方法：
我使用内联样式仅作为示例，您需要分配类、使用样式表等。另外，我修复了文本输入元素上的拼写错误，因为它是一个 self结束标签。
祝你好运！
Using CSS to style the elements is the usual way:
I'm using inline styles as example only, you'd want to assign classes, use a stylesheet, etc. Plus I fixed the typo on the text input element as it is a self closing tag.
Good luck!
尝试将其添加到您的 css 样式表中：
然后将 id 添加到您的文本区域中：
您还可以尝试将这两个元素放入 html 表格中，并将表格的对齐方式设置为中间。
Try adding this to your css stylesheet:
Then add the id to your textarea:
You could also try putting both of these elements inside of an html table with the table's alignment set to middle.