выравнивание по горизонтали в делении

Question

У меня есть такая коробка:

<div id="selectBox">
Select:
<select>
<option>1</option>
<option>2</option>
</select>
</div>

Как мне выровнять их так, чтобы они были горизонтальны посередине друг друга, базовой линии текста «Выбрать» и содержимого поля выбора («1»).

Я могу решить эту проблему, обернув вокруг них стол и сделать две ячейки, но я чувствую, что метод очень грубый.

Визуальный пример того, что я хочу: взгляните на верхнюю строку состояния @stackoverflow. у него есть ИМЯ | выйти | о | часто задаваемые вопросы Теперь: обратите внимание, как текст выравнивается по TOP, а поле поиска находится посередине (потому что оно занимает это место). Я хочу, чтобы текст был выровнен по середине: D Мой браузер атм IE7

Answer 1

Editted:

<div id="selectBox">
    <label for="select">Select:</label>
    <select id="select">
        <option>1</option>
        <option>2</option>
    </select>
</div>

тогда CSS:

#selectBox label
{
    vertical-align:bottom;
}

Смотрите здесь: jsFiddle

Answer 2

Вы не можете выровнять текст внутри выделения с чем-либо. Лучшее, что вы можете получить, - это попробовать разные значения для vertical-align, но имхо будет невозможно получить одинаковое выравнивание в разных браузерах.

Answer 3

не уверен ... пожалуйста попробуйте стиль float: слева от div

float:left;