Add padding to backgroundposition option

[Richard]

OK, so this might be a semi-strange one but here goes.  I have an AjaxLoadingPanel wired up to a UpdatePanel and it's working really well.  Inside the UpdatePanel is a RadGrid that is set to Client Load.  It's perfect - almost.

By default, the icon for loading is centered on the radgrid which is set to paging enabled at 100.  That means, the loading icon isn't visible because you would have to scroll down the page to see it.  Since the paging of 50 starts the grid at a size of 50 rows.  Setting the BackgroundPosition to top is handy but doesn't look great.  I know this sounds silly but it's right over the command bar of the RadGrid.  Visually, it just looks "off".

So using this: <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default" BackgroundPosition="Top"></telerik:RadAjaxLoadingPanel>

Is there a way, most likely CSS, to set a padding-top so the icon appears maybe 100px padded from the top of the loading window.  Again, I know it sounds silly but I put an image so you had an idea of what I was referring to.

I'll keep hacking around and see if I can find the option in CSS.

Thanks,

Richard

[Eyup]

Hi Richard,

You can try using the following CSS rule to achieve this requirement:

<style>
    div.RadAjax .raDiv.raTop {
        background-position-y: 100px;
        /*alternative approach
        top:100px;*/
    }
</style>

I hope this will prove helpful.

Regards,
Eyup
Progress Telerik

[Richard]

Worked perfectly!  Thanks.