需要在不同的 div 中垂直对齐 p 标签

【问题标题】：Need to a vertical alignment of a p tag within different divs需要在不同的 div 中垂直对齐 p 标签
【发布时间】：2015-02-03 18:00:19
【问题描述】：

嘿，我在一个网站上工作，碰巧我试图在不同的 div（具有不同的高度）内对 p 标签进行垂直对齐，但我做不到。你能帮帮我吗？

【问题讨论】：

你需要和我们分享一些代码，也许是小提琴之类的。目前无法为您提供帮助。

标签： html css web frontend

【解决方案1】：

在 jsfiddle 上测试，有效。宽度、高度和边框用于演示对齐方式。需要 CSS3 浏览器支持。

<div style="width: 300px; height: 300px; border: 1px solid #000000;">
    <p style="display:block; position: relative; top: 50%; transform: translateY(-50%); margin: auto; border: 1px dashed red; width: 100px; text-align: center;">Content</p>
</div>

【讨论】：

这行不通 - 看看这个稍微编辑过的代码版本：jsfiddle.net/wL9mq8k3
用 CSS3 更新，使用更简单。顺便说一句，如果您使用 javascript 调整高度，前一个工作，我提到过。现在这是纯 CSS3。