firefox textareaプレースホルダ埋め込み

Question

プレースホルダのCSSをtextareaアイテムで編集するときに問題が発生します。 Firefoxを除くすべてのブラウザで正常に動作します。プレースホルダ（firefox内）は、padding以外のすべてのCSS属性を取ります。以下textareaにそれを与える、問題

<textarea rows="4" name="mensaje" placeholder="CONSULTA" required="required" ></textarea> 

::-webkit-input-placeholder { 
    color: #FFF; 
    text-align:left; 
    font-size:11px; 
    padding:5px; 
} 
:-moz-placeholder { /* Firefox 18- */ 
    color: #FFF; 
    text-align:left; 
    font-size:11px; 
    padding:5px; 
} 
::-moz-placeholder { /* Firefox 19+ */ 
    color: #FFF; 
    text-align:left; 
    font-size:11px; 
    padding:5px; 
} 
:-ms-input-placeholder { 
    color: #FFF; 
    text-align:left; 
    font-size:11px; 
    padding: 5px; 
} 

https://jsfiddle.net/1wxqdh63/

Answer 1

代わりのプレースホルダにpadding:5pxを与える再生最小コードとJSFiddleあります。そうすれば、あなたは何の問題もないと確信しています。
こちらをご覧jsfiddle

コード：

textarea { 
padding:5px; 
-moz-box-sizing: border-box; 
-webkit-box-sizing: border-box; 
box-sizing: border-box; 
} 
::-webkit-input-placeholder { 
    text-align:left; 
    font-size:11px; 
} 
:-moz-placeholder { /* Firefox 18- */ 
    text-align:left; 
    font-size:11px; 
} 
::-moz-placeholder { /* Firefox 19+ */ 
    text-align:left; 
    font-size:11px; 
} 
:-ms-input-placeholder { 
    text-align:left; 
    font-size:11px; 
} 

HTML：

<textarea rows="4" name="mensaje" placeholder="CONSULTA" required="required" > </textarea>