How to move button left inside table - html

Question

I have this ASP code:
<asp:Repeater ID="PervousResultsList" runat="server" EnableViewState="False">
<ItemTemplate>
<div class="row1">
<table style="cursor: pointer; width: 100%">
<tr>
<td rowspan="4">
<asp:Image ID="Image1" ImageUrl="~/Images/pushpinred.png" runat="server" Width="32"
Height="32" /></td>
</tr>
<td rowspan="10">
<input type="button" id="ddd" value="B" style="height:30px" />
</td>
</tr>
<tr>
<td>text:</td>
<td rowspan="4">
<h1 style="color: gray"><%# Eval("Text") %></h1>
</td>
</tr>
<tr class="hidden">
<td>text:</td>
<td><%# Eval("Text") %></td>
</tr>
<tr class="hidden">
<td>X:</td>
<td><%# Eval("Lon") %></td>
</tr>
<tr class="hidden">
<td>Y:</td>
<td><%# Eval("Lat") %></td>
</tr>
<tr>
</table>
</div>
</ItemTemplate>
</asp:Repeater>
I bind a repeater in server side to the data source:
PervousResultsList.DataSource = _marker.GetPervousResults();
PervousResultsList.DataBind();
Here is how it looks in view:
How can I move button B to the left that it will looks like this:

Answer 1

<table style="cursor: pointer; width: 100%">
<asp:Repeater ID="PervousResultsList" runat="server" EnableViewState="False">
<itemtemplate>
<div class="row1">
<tr>
<td rowspan="10">
<input type="button" id="ddd" value="B" style="height:30px" />
</td>
<td rowspan="4">
<h1 style="color: gray"><%# Eval("Text") %></h1>
</td>
<td>text:</td>
<td rowspan="4">
<asp:Image ID="Image1" ImageUrl="~/Images/pushpinred.png" runat="server" Width="32"
Height="32" />
</td>
</tr>
<tr class="hidden">
<td>text:</td>
<td><%# Eval("Text") %></td>
</tr>
<tr class="hidden">
<td>X:</td>
<td><%# Eval("Lon") %></td>
</tr>
<tr class="hidden">
<td>Y:</td>
<td><%# Eval("Lat") %></td>
</tr>
</div>
</itemtemplate>
</asp:Repeater>
</table>

Answer 2

I Think what you could do is take the table definition outside of the repeater and define your table rows right.
Try this and let me know if it helps (I didn't test the code):
<table style="cursor: pointer; width: 100%">
<tr>
<td>Header</td>
<td>Header</td>
<td>Header</td>
<td>Header</td>
<td>Header</td>
<td>Header</td>
</tr>
<asp:Repeater ID="PervousResultsList" runat="server" EnableViewState="False">
<ItemTemplate>
<tr>
<td>
<input type="button" id="ddd" value="B" style="height:30px" />
</td>
<td>
<asp:Image ID="Image1" ImageUrl="~/Images/pushpinred.png" runat="server" Width="32" Height="32" />
</td>
<td>
<h1 style="color: gray"><%# Eval("Text") %></h1>
</td>
<td>
<%# Eval("Text") %>
</td>
<td>
<%# Eval("Lon") %>
</td>
<td>
<%# Eval("Lat") %>
</td>
</tr>
</ItemTemplate>
</asp:Repeater>
</table>
In the code the repeater will create only the table rows in each iteration. You define the table and header outside of the repeater because otherwise you would be creating a new table for each iteration. Aditionally, a <tr> defines a row.