[Rails]アイコンを横一列に並べたいができない

前提・実現したいこと

アイコンを横に並べたいです。

発生している問題・エラーメッセージ

ですが、こうなってしまいます。

後述のソースコードの通り、brやpなどで改行はしておりません。

該当のソースコード

ruby
1# _micropost.html.erb
2<li id="micropost-<%= micropost.id %>">
3  <%= link_to gravatar_for(micropost.user, size: 50), micropost.user %>
4  <span class="user"><%= link_to micropost.user.name, micropost.user %></span>
5  <span class="username">@<%= micropost.user.username %></span>
6  <span class="content">
7    <%= micropost.content %>
8    <%= image_tag micropost.picture.url if micropost.picture? %>
9  </span>
10
11
12　#該当の場所ここから↓
13  <%= render "likes/like", micropost: micropost %>
14  <%= render 'microposts/reply_modal', micropost: micropost %>
15  #該当の場所ここまで↑
16
17  <span class="timestamp">
18    Posted <%= time_ago_in_words(micropost.created_at) %> ago.
19    <% if current_user?(micropost.user) %>
20      <%= link_to "delete", micropost, method: :delete,
21                                       data: { confirm: "You sure?" } %>
22    <% end %>
23  </span>
24</li>

ruby
1# _like.html.erb
2
3<span class="like">
4  <% if micropost.iine?(current_user) %>
5    <%= form_for(micropost.likes.find_by(user_id: current_user.id), method: :delete, remote: true) do |f| %>
6      <%= button_tag(class: "btn btn-default") do %>
7        <%= content_tag :span, "#{micropost.likes_count}", class: "glyphicon glyphicon-heart" %>
8      <% end %>
9    <% end %>
10  <% else %>
11    <%= form_for(micropost.likes.build, remote: true) do |f| %>
12      <div><%= hidden_field_tag :micropost_id, micropost.id %></div>
13      <%= button_tag(class: "btn btn-default") do %>
14        <%= content_tag :span, "#{micropost.likes_count}", class: "glyphicon glyphicon-heart-empty" %>
15      <% end %>
16    <% end %>
17  <% end %>
18</span>

ruby
1# _reply_model.html.erb
2
3#関係ありそうなのはここから↓
4<button type="button" class="btn " data-toggle="modal" data-target="#replyModal" data-whatever="<%= User.find(micropost.user_id).username %>">
5<span class="glyphicon glyphicon-comment" aria-hidden="true"></span>
6</button>
7#関係ありそうなのはここまで↑
8
9
10# ここから下はモーダルウィンドウのコード
11<div class="modal fade" id="replyModal">
12  <div class="modal-dialog">
13    <div class="modal-content">
14      <div class="modal-header">
15        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
16        <h4 class="modal-title">Send reply</h4>
17      </div>
18      <div class="modal-body">
19        <%= render 'shared/micropost_form'%>
20      </div>
21      <div class="modal-footer">
22        <button type="button" class="btn btn-primary" data-dismiss="modal">close</button>
23      </div>
24    </div>
25  </div>
26</div>
27
28<script type="text/javascript">
29$('#replyModal').on('show.bs.modal', function (event) {
30  var button = $(event.relatedTarget) 
31  var recipient = button.data('whatever') 
32  var modal = $(this) 
33  modal.find('.modal-title').text('New micropost to ' + recipient)
34  modal.find('#micropost_content').text('@' + recipient + ' '); 
35})
36</script>

分かる方いらっしゃいましたら、ご教授よろしくお願いいたします。

-追記-

_like.html.erbのform_forが悪さをしているみたいです。ですが、form_for内部の<div><%= hidden_field_tag :micropost_id, micropost.id %></div>がないと、micropost.idを送ることができません。引き続きいいねボタンの修正を行いますが、いいねボタンとコメントボタンが並行に並ぶ方法が分かる方いらっしゃいましたら、ご教授よろしくお願いいたします。