Problems with Custom Designer Position

I'm using a custom designer that takes up a good amount of space.  As a result, it runs off the right of the visible portion of the page (see screenshot) requiring a user to either move the designer or scroll.  I'd like to move it to the center of the screen.

I've tried overriding existing CSS, but it seems the designer itself is in an iframe and the CSS I need to modify is outside of it.

Is there a way to either override the template or CSS to center the designer on the screen?

Hello Norsenerd,

Did you try this javascript method

dialogBase.resizeToContent();

execute it when the dialog loads - e.g. register a load handler with

this._loadDelegate = Function.createDelegate(this, this._load);
Sys.Application.add_load(this._loadDelegate);

and then create a function named _load()

Hi Lubomir,
  I tried add the load delegate as you suggested, but it did not resolve the issue I was having.  My understanding of the dialogBase.resizeToContent() method is that it re-sizes the content area itself so that all content can be seen.  The issue I'm having is that I want the dialog base to be further over to the left.

I know the CSS change I need to make, but adding a style block (even when adding an !important on the property) in the design markup file or using jQuery to modify the property does not work.

Do you have any other suggestions?

Hi Norsenerd,

In this case you could try moving the dialog in the onload event handler. First you need to get a reference to the RadWindow in which you have your dialog. Use this function:

Then once you get a reference to the RadWindow in a variable named e.g. oWnd you can retrieve its current bounds with var bounds = oWnd.getWindowBounds(); and you can move the window with oWnd.moveTo(x, y) and resize it with oWnd.set_width(width) and oWnd.set_height(height).


Kind regards,

Thanks, Lubomir!  That was exactly what I needed.