Displaying three elements inside a <div> in a same line

Given this html code:

  <div class="produto_title">
    <h2 th:text="${produto.name}"></h2>
    <a href="#" class="btn_free">Baixar</a>
    <a href="#" class="btn_comprar">Comprar <span th:text="${produto.preco}"></span></a>
  </div>

Could anyone give me a hint for its style to place the three items inside .produto_title in a same line (h2 floating at left and the two a floating at right).

Also, h2 has a border around itm and the a is displayed like a button; I want add a line behind crossing all the "line" formed by this three elements, like this:

jsfiddle: https://jsfiddle.net/klebermo/sf7a6fnj/5/

ps.: also, how let the content of tag <span> inside the button, like the text?