Css Firefox上的样式占位符

我想做的是让一个占位符出现在中间50%的顶部和50%的左侧。它在Chrome上看起来不错，但在Firefox23上却不行。我有一个例子。 我的风格如下：

textarea::-moz-placeholder {
     position: relative;
     font-size: 16px;
     font-style: italic;
     color: #ABABAB;
     top: 50%;
     text-align: center;
}

textarea::-webkit-input-placeholder {
    position: relative;
    font-size: 16px;
    font-style: italic;
    color: #ABABAB;
    top: 50%;
    text-align: center;
}

---

如果有人能帮忙，我将不胜感激，谢谢

在css中使用填充，而不是给出位置：

textarea::-moz-placeholder {
 position: relative;
 font-size: 16px;
 font-style: italic;
 color: #ABABAB;
 padding-top: 50px;
 padding-left:50px;
 text-align: center;
}

textarea::-webkit-input-placeholder {
position: relative;
font-size: 16px;
font-style: italic;
color: #ABABAB;
padding-top: 50px;
padding-left:50px;
text-align: center;
}

---

你可以根据需要调整填充物。

我试过一些奇怪的东西，但似乎很合适：
请参见此

您必须在

textarea

上添加

required

属性：

<textarea placeholder="Placeholder" required="required"></textarea>

---

textarea:not（：invalid）{text align:left；}

-这是个好主意！我一直在想它能解决的问题。一个问题是，它在不理解

：not（：invalid）

@FAngel的旧浏览器中无法正常工作是的，我也这么认为。但是较旧的浏览器甚至可以处理

占位符

属性吗？当然不能，但是它们可以处理

文本区域{text align:center；}

，这是一个问题。我可以在不需要属性的情况下使用它吗？@TakácsZsolt我不这么认为，因为

选择器无效
textarea {
    height: 300px;
    width: 300px;
    /* center the text by default */
    text-align:center;
    resize: none;
}

/* align the text left when insert */
textarea:focus {text-align: left;} 
/* textarea not empty will have text align left */
textarea:not(:invalid) {text-align: left;}
/* remove the red shadow of firefox if textarea is empty */
textarea:invalid {box-shadow: none;}
/* hide the placeholder on focus */
textarea:focus::-moz-placeholder {opacity: 0;}

textarea::-moz-placeholder {
    position: relative;
    font-size: 16px;
    font-style: italic;
    color: #ABABAB;
    /* the main trick to center the placeholder vertically */
    line-height:300px;
}

textarea::-webkit-input-placeholder {
    position: relative;
    font-size: 16px;
    font-style: italic;
    color: #ABABAB;    
    line-height: 300px; 
    /* keep the placeholder centered under chrome */
    text-align: center;
}