我怎样才能得到我的
沿 边垂直居中的元素和<文本区域>领域？
我无法将 p、input 和 textarea 元素全部集中在 a 中的 li 元素中我现在正在处理的用户设置区域。现在，只有 input 和 textarea 元素在 li 元素中正确居中，而 p 元素则在位于顶部。我尝试将
vertical-align: middle
应用于 li 元素，但失败了。
为了帮助指导您查看我的示例，每个元素的背景颜色如下：
p= redli= 青色input&textarea= white
如何让 p、input 和 textarea 元素全部在 li 元素？
I can't get the p, input and textarea elements all be centered with in a li elements in a user settings area I am working on right now. Right now only the input and textarea elements are being properly centered with in the li elements while the p elements are positioned right at the top. I have tried to apply
vertical-align: middle
to the li element but it failed.
My example code link is here at JS Bin
To help guide you while looking at my example, each element's background color is as follows:
p= redli= cyaninput&textarea= white
How can I get the p, input and textarea elements all be centered with in a li elements?
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
我了解到像 Twitter 和 Facebook 这样的网站使用以下 HTML 元素创建其设置页面：
所以我决定遵循这个标准实践和 这是我想出的。 CSS 样式不存在，但您可以看到
table元素及其子元素提供的基本实体结构。请注意table tbody tr th label名称如何自动定位在其包含的表格单元格的中心。如果我需要将它们定位到顶部、底部或基线，那么我需要做的就是将vertical-align添加到label的父元素，即>th。这是向第
添加元素与vertical-align: top;样式的结果textarea位于同一行。如果我想将
label元素水平放置在表格单元格中，那么我只需要要做的就是在第th元素上使用text-align选择器，然后就可以了。这是将
text-align: right;添加到第二个的结果在第二个tr以及第三个和第四个tr th元素中。I learned that sites like Twitter and Facebook create their settings pages with the following HTML elements:
So I decided to follow this standard practice and this is what I came up with. The CSS styling is not there but you can see that basic solid structure that the
tableelement and its child elements provide. Notice how thetable tbody tr th labelnames automatically are positioned at the center of their containing table cell. And if I need them to be positioned to the top, bottom or baseline than all I need to do is addvertical-aligntolabel's parent element which isth.This is the result of adding
vertical-align: top;styling to thethelement in the same row as thetextarea.And if I want to position the
labelelements horizontally with in the table cell then all I need to do is use thetext-alignselector on thethelement and presto.This is the result of adding
text-align: right;to the 2ndthin the 2ndtrand the 3rd and 4thtr thelements.