[解決済み] HTML5 プレースホルダー css パディング

質問

こんなの見たことある ポスト を変更しようとしたのですが、残念なことに、パディングがうまくいかないようです。

とりあえず、cssのコードはこんな感じです。( EDIT : これはsassから生成されたcssです)

#search {
  margin-top: 1px;
  display: inline;
  float: left;
  margin-left: 10px;
  margin-right: 10px;
  width: 220px;
}

#search form {
  position: relative;
}

#search input {
  padding: 0 10px 0 29px;
  color: #555555;
  border: none;
  background: url('/images/bg_searchbar.png?1296191141') no-repeat;
  width: 180px;
  height: 29px;
  overflow: hidden;
}

#search input:hover {
  color: #00ccff;
  background-position: 0px -32px;
}

そして、これがシンプルなhtmlです。

<div id="search">
  <form>
    <input type="text" value="" placeholder="Search..." name="q" autocomplete="off" class="">
  </form>
  <div id="jquery-live-search" style="display: block; position: absolute; top: 15px; width: 219px;">
    <ul id="search-results" class="dropdown">
    </ul>
  </div>
</div>

かなり単純な？プレースホルダーがなぜかずれているのですが、入力欄に入力しようとすると、文字が整列しているのです。色しか変えられないようです。 webkit を編集しようとすると、入力のデザインが崩れてしまいます。 髪を引っ張る

以下は、プレースホルダーとテキスト入力された入力フィールドのスクリーンショットです。

EDIT :

今のところ、私はこれに頼っています。 jqueryプラグイン .

それは箱から出してすぐに動作し、私のクロームの問題が修正されました。やはり問題が何なのか解明したいです（MYクロームと関係があるのかどうか）

John Catterfeldが問題なく再現してくれたので、スタイルではないことは確かなのですが、なぜこれが私（クライアントのクロームも）に起こっているのか、誰か正しい方向を示してくれることを期待しています。ということは、ジョンがWindowsを使っているならば、これはおそらくChrome/OSXのネイティブなものなのでしょう)

解決方法は？

同じ問題が発生しました。

私は入力からラインハイトを削除することで解決しました。問題の原因となっている行の高さがあるかどうか確認してください。