で行の高さ：スタイルを持つはHTML5、プレースホルダ、私は入力フィールド持ちのWebkit
<input type="text" placeholder="whatever">
：
input {
margin: 0;
padding: 0 6px;
font-size: 19px;
line-height: 19px;
height: 36px;
width: 255px;
}
問題は、行の高さは、WebKitの内のプレースホルダのための効果を取っていないですクロム。入力フィールドのテキストは醜い方法で整列されます。誰もがこれを見て、今それを修正する方法は？
おかげ
は、私はあなたが何かのように書いていると仮定しています...
<input type="text" placeholder="whatever">
残念ながら、Chromeはセレクタは次のようになり、手を繋ぎます...
あなたはスタイリングのオプションを見つけることができinput::-webkit-input-placeholder {}
、落とし穴とあなたの行の高さの宣言は完全にWOR削除することが表示されますStyling the HTML Placeholder
ありがとうございました。ユニークですが。プレースホルダはこれらのスタイルを暗黙的に継承する必要があります。 –
私は、私は完全にあなたの問題を複製することができるとは思わないが、おそらくあなたはpadding: 7px 6px;を使用して、それを修正することができます。 これを行うとうまくいけば、ちょうどline-heightと同様の仕事をする7pxにあなたの上部と下部のパディングを設定する必要があります。サイズ（幅/フォントサイズ）が異なる場合は、(height - fontsize)/2を計算して、適切なパディングを選択することができます。それはプレースホルダをスタイリングに来るとき、あなたのタグを見てみると
でブラウザをサポートks。 FF7、Chrome15、Safari 5.1では私にとってうまくいっています。 IE9とFF3.6でも良く見えましたが、IE8では良く見えません。
これは私のために働いた。しかし、場合によっては、入力に対して 'line-height'を削除したくないかもしれないので、誰にとってもうまくいかないかもしれません。 –
優れています。線高さ：正常;私が以前に頼りにしたことのないものですが、ここで理にかなっています。私は、プレースホルダとその変動セレクタ標準は、追加するのではなく削除することによって修正する不完全なコードの良い言い訳であると言います。 – jerclarke
入力要素は1行でのみ動作します - 行の高さは適用されません。 –
入力プレースホルダは、画素ラインの高さの値を好きなようには見えませんが、これは縦に入力して、それを中心に説明する：
::-webkit-input-placeholder { line-height: normal; }
説明を追加してください – tnw
これはプレースホルダと関係があるのでしょうか？ – xzyfer
入力のプレースホルダテキストが、行高さCSSルールと揃っていません。 – AnApprentice
Chromeのバグのようです：http://stackoverflow.com/questions/4919680/html5-placeholder-css-padding-problem – Emily