Help needed to align controls in a webpage

Question

I’m not too familiar with webpage design and am having a problem. I have the following datalist which is displayed ok but it is the section near the bottom that I am having with. I want the Hyperlink image to be on the same line as the “Details” text. Unfortunately the text appears below the Hyperlink control. Is there an easy fix to get what I want ? Should I be using the “div” mark-up instead of and ?

<asp:DataList ID="dgDownloads" Width="100%" runat="server" EnableViewState="false" >
    <ItemTemplate>            
            <tr>
                <td>
                    <h3 class="mast3"><%# DataBinder.Eval (Container.DataItem, "Alias", "Reported by : {0}")%></h3>
                </td>
                <td>
                    <h3 class="mast3"><%# DataBinder.Eval(Container.DataItem, "CreationDate", "Reported on : {0:dd/MM/yyyy}")%></h3>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <h3 class="mast6"><%# ((System.Data.IDataRecord) Container.DataItem)["Heading"] %></h3>
                </td>
            </tr>
            <tr>
                <td colspan="2">
                    <asp:HyperLink CssClass="buttonStyle" ImageUrl="../images/bg/download.png" runat="server" NavigateUrl='<%#((System.Data.IDataRecord) Container.DataItem)["FileURL"] %>' />
                    <%# ((System.Data.IDataRecord) Container.DataItem)["Details"] %><ln/><br/><br/>
                </td>
            </tr>
    </ItemTemplate>
</asp:DataList>

Answer 1

Is your datalist not wide enough to fit the hyperlink image and details text in one row?

Try this:

<span style="white-space:nowrap;"><asp:HyperLink CssClass="buttonStyle" ImageUrl="../images/bg/download.png" runat="server" NavigateUrl='<%#((System.Data.IDataRecord) Container.DataItem)["FileURL"] %>' />&nbsp;<%# ((System.Data.IDataRecord) Container.DataItem)["Details"] %></span>