css - 選択をJQueryボタンと垂直方向に揃える方法は?

Question

これには簡単な解決策があると確信していますが、これまでのところそれが見つからず、PC を窓から放り投げる準備ができています。

ボタンの高さが選択の高さよりも大きい場合に、選択をjQueryボタンに垂直方向に配置する方法を教えてください。このような：

http://jsfiddle.net/hCCzQ/4/

選択がボタンの中央になるようにそれらを揃えようとしています。

どうもありがとう！

Answer 1

これは私にとってはうまくいきます：

select, button {
    vertical-align: middle;
}
​

デモ: http://jsfiddle.net/hCCzQ/6/

Answer 2

これを試して：

http://jsfiddle.net/oscarj24/5FL4a/

 $(document).ready(function() {

  var b = $("#abutton");
  var s = $('select');   

  $(b, s).css('vertical-align', 'middle');
 });

---

@jnylen 投稿の CSS スタイルでクラスを使用する:

JS:

$(document).ready(function() {
    var b = $("#abutton");
    var s = $('select');   

    b.addClass('btn');
    s.addClass('ddl');
});

CSS:

.btn {
    margin: 0;
    padding: 0;
    height: 40px;
    width: 32px;
    vertical-align: middle;
}

.ddl {
    margin: 0;
    padding: 0;
    position: relative;
    top: 2px;
    vertical-align: middle;
}​

</p>

Answer 3

これは、ピクセルパーフェクトにするために私が見つけた唯一の方法です。

button {
    margin: 0;
    padding: 0;
    height: 40px;
    width: 32px;
    vertical-align: middle;
}

select {
    margin: 0;
    padding: 0;
    position: relative;
    top: 2px;
    vertical-align: middle;
}

デモ: http://jsfiddle.net/hCCzQ/12/

Firefox と IE7 ではかなり見栄えがします。