Telerik file upload control rendering issue

3 posts, 0 answers
  1. Tim
    Tim avatar
    2 posts
    Member since:
    May 2014

    Posted 09 May 2014 Link to this post

    I have a Telerik file upload control. it renders misaligned to the other items on the page. How can I get the control to render left aligned?

    The markup looks like this:

                <table>
                    <tr>
                        <td colspan="2">
                            <asp:Label ID="PleaseSelectAFileLabel" runat="server" Visible="false" Text="Please select a file." CssClass="ControlLabel"></asp:Label><br />
                            <asp:Label ID="PleaseSelectAFileType" runat="server" Visible="false" Text="Please select a file type." CssClass="ControlLabel"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div style="font-size:15px; font-weight:bold">File Type</div>
                        </td>
                        <td style="width: 296px" colspan="2">
                            <asp:DropDownList ID="EmployeeImportFormatDropDownList" AutoPostBack="true" runat="server" Width="200px" OnLoad="EmployeeImportFormatDropDownList_OnLoad"></asp:DropDownList>
                            <asp:LinkButton ID="EmployeeImportFormatDownloadLink" runat="server" Text="Download Template" OnClick="EmployeeImportFormatDownloadButton_OnClick" />
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <div style="font-size:15px; font-weight:bold">File</div>
                        </td>
                        <td colspan="2">
                            <%--<asp:FileUpload ID="DataImportFileUpload" runat="server" Width="400px" EnableViewState="true"/><br />--%>
                            <telerik:RadAsyncUpload runat="server"  ID="DataImportsRadAsyncUpload" MultipleFileSelection="Disabled" MaxFileInputsCount="1" Width="375px" AllowedFileExtensions=".csv" />
                        </td>
                    </tr>
                    <tr valign="top">
                        <td width="75px"></td>
                        <td style="width: 296px">
                            <asp:Button ID="DataImportFileUploadImportButton" runat="server" Text="Import" OnClick="DataImportFileUploadImportButton_OnClick"/>&nbsp;&nbsp;<asp:Button ID="DataImportFileUploadCancelButton" runat="server" Text="Cancel" OnClick="DataImportUploadCancelButton_OnClick"/><br /><br />
                            <asp:LinkButton ID="DataImportMappingLink" runat="server" Text="Employee Data Import Mapping" PostBackUrl="../Company/ImportDataMapping.aspx"></asp:LinkButton>
                        </td>
                    </tr>
                </table>
  2. Hristo Valyavicharski
    Admin
    Hristo Valyavicharski avatar
    975 posts

    Posted 14 May 2014 Link to this post

    Hi Tim,

    This misalignment seems to be caused by your custom styles. Here is how the control is rendered at my side: http://screencast.com/t/nEE9muYen

    Please provide a sample or link to your site.

    Thanks.

    Regards,
    Hristo Valyavicharski
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Tim
    Tim avatar
    2 posts
    Member since:
    May 2014

    Posted 15 May 2014 in reply to Hristo Valyavicharski Link to this post

    I tracked it down.  The Telerik control uses an un-ordered list (ul) to create the green dot beside the uploaded file.  In the master page, there was a style setting ul's to a width of 25 pixels.
Back to Top