asp.net - div の場所が異なるのはなぜですか?

Question

そのため、座標をデータベースに保存するイメージ タガーを作成し、メイン ページの erb ブロックを使用してそれらの座標を呼び出し、その場所 (.tagged) に div を表示します。ただし、タグがメイン ページに表示されると、接続ページでタグを付けたときの場所にはありません。これがなぜなのか、誰にも考えがありますか？前もって感謝します。

メインページの結果

接続ページの画像タガー

メインページのERB：

<% if @new_manual.present? %>
<% n = 0 %>
<% @new_manual.steps.each do |step| %>
    <% n += 1 %>

    <% i_connection = Contact.find(step.input_contact) %>
        <span class="i_contact i_contact<%= n %>" data-pos-x="<%= i_connection.pos_x %>" data-pos-y="<%= i_connection.pos_y %>"  data-pos-width="<%= i_connection.pos_width %>" data-pos-height="<%= i_connection.pos_height %>" ="spanid<%= n %>" data-index="<%= n %>"></span>


    <% o_connection = Contact.find(step.output_contact) %>
        <span class="o_contact o_contact<%= n %>" data-pos-x="<%= o_connection.pos_x %>" data-pos-y="<%= o_connection.pos_y %>"  data-pos-width="<%= o_connection.pos_width %>" data-pos-height="<%= o_connection.pos_height %>" id="spanid<%= n %>" data-index="<%= n %>"> </span>
        <% cord = CordType.find(step.contact_item) %>


<div class="main_panel">
<div style='margin: auto; width: 600px;'>
    <div id="image_panel<%= n %>" style="float:left; width:600px; position:relative;">
        <%= image_tag(i_connection.image.image.url(:large)) %>
<div class="i_tagmap<%= n %>"></div>
</div>
</div>
</div>

<div class="main_panel">
<div style='margin: auto; width: 600px;'>
    <div id="image_panel<%= n %>" style="float:left; width:600px; position:relative;">

        <%= image_tag(o_connection.image.image.url(:large)) %>
<div class="o_tagmap<%= n %>"></div>
</div>  
</div>  
</div>

<% end %>   
<% end %>