html - 選択したテキストを垂直方向に中央揃え

Question

画像

質問

"CITIES" や "CHANGE" に合わせて "Vancouver, BC" のテキストを少し下に移動する方法はありますか?

入力要素は、ブラウザー間でスタイルを設定するのが難しいことを知っています。完璧である必要はありませんが、少なくとも一部のブラウザーで動作する場合、それは素晴らしいことです。

フィドル

Answer 1

フォントサイズまたは高さを調整して、配置の問題を修正します。

#city_picker {
    height: 26px;
    font: 19px Arial,Helvetica,sans-serif;
}

これにより、テキストが選択ボックスとほぼ同じサイズになり、強制的に整列して表示されます。そうしないと、ブラウザ間でオプション要素のスタイルを調整することは、不可能ではないにしてもかなり困難に思えます。