Как выровнять input

мой input с классом but_get съезжает вверх а должен быть inline как это сделать? введите сюда описание изображения Вот мой html

<div id="button_get">
        <input id="but_get_1" type="text" class="but_get"/>
        <div><select id = "color_1" class="color" onchange = "color(this.id, this.value)">
            <option value="gr">Цвет</option>
            <option value="g">Зеленая</option>
            <option value="r">Красная</option>
            <option value="b">Синяя</option>
            <option value="w">Белая</option>
        </select></div>
        <div><label for="url_chek" id="url_chek_l">URL-кнопка</label>
        <input type="checkbox" value = "1" id="url_chek"/></div>
    </div>

Вот мой css:

#button_get div{
    display: inline;
}

.but_get{
    display: inline;
    margin-right: 15px;
    width: 120px;
    height: 31px;
}

#url_chek{
    margin: 0 auto;
    display: inline-block;
    vertical-align: middle;
}

#url_chek_l{
    vertical-align: middle;
}

#button_get{
    margin-top: 25px;
    height: 50px;
}

.color{
    display: inline-block;
    vertical-align: middle;
    height: 31px;
    width: 90px;
    margin-right: 5px;
}

Ответы (2 шт):

Автор решения: Tuchyn2511

Если можно использовать флексы, то все просто. Родительскому блоку указываете display: flex;, затем выравниваете по центру их по центру align-items: center;. Проверил на jsfiddle, с использованием флексов все ровно.

#button_get{
   margin-top: 25px;
   height: 50px;
   display: flex;
   align-items: center;
}
→ Ссылка
Автор решения: Constantine Tretyakoff

Инлайновые элементы переносятся:

#button_get {white-space: nowrap;}

→ Ссылка