Форма - кнопка справа и пролёт влево

Question

Я знаю, что это должно быть легко, но у меня проблемы с позиционированием элемента span слева, а его кнопка справа (на той же строке). Я внутри тега формы. Первая картинка - это то, что я получаю, когда добавляю float: right; Второй без.

Мне нужно, чтобы текст располагался вертикально по центру ... Вот мой html:

<div id="main" >
  <form method="POST" action="{{'addtech'}}" class="namelist" name="form">
      {% csrf_token %}
      {% for tech in techs %}
         <div class="selectable">
            <input type="hidden" name ="tech_id" value={{tech.id}}>
               <h5>
                 <span class="tech_name">{{tech.name}}</span>
                 <button class="btn btn-info" name="move" id="{{tech.id}}">Add to the team</button>
               </h5>
         <div>
      {% endfor %}
   </form>

и мой css:

#main
{
  line-height: 400px;
  text-align:center; 
  vertical-align:middle;
}

form[name="form"]
{
    position:relative;
  vertical-align: middle;
  line-height: 14px; 
}

button[name="move"]
{

    size: 70%;
}

Просвети меня .. спасибо !!!