RadWindow Height Property Not Setting Correctly

2 posts, 0 answers
  1. PWakeman
    PWakeman avatar
    2 posts
    Member since:
    Aug 2007

    Posted 29 Sep 2011 Link to this post


    We have a web application that we use a Rad Window component in to open edit windows for detail information. For the most part they work perfectly, except when it comes to setting the height of the window. These windows are all opened at different sizes depending on properties sent to the javascript as you can see below. Again, the widths all work correctly. 

    Below is the javascript used to set the properties of the window:

    function openNewCheckWindow(checkId, width, height) {
            var oWnd = radopen("/PerMar/Users/AddCheckToRequest_Users.aspx?CheckTypeId=" + checkId);
            oWnd.set_behaviors(Telerik.Web.UI.WindowBehaviors.Move + Telerik.Web.UI.WindowBehaviors.Close);

    The width, behaviors and centering all work perfectly. The height not so much. Looking at the source in Firebug in Firefox, the tbody tag doesn't appear to receive the style attributes that the table gets, and thus pushes the height of the whole table too high. Attached is a screenshot of what i'm trying to explain. 

    If i edit the html in Firefox and add the style to the tbody tag, the window height sizes perfectly, but without the correct style attribute - you can see the extra white space in the screenshot.

    It seems to affect Firefox and Chrome alike, and we are running the RadControls for Ajax v.2011.2.712.35. I noticed in another post someone recommended ensuring the doctype was correct on the page, and ours is:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    IE (oddly enough) shows the RadWindow correctly, which is a first..

    Is there something i'm missing?

    Paul Wakeman
  2. Marin Bratanov
    Marin Bratanov avatar
    4626 posts

    Posted 03 Oct 2011 Link to this post

    Hi Paul,

    This behavior is observed because there is a limitation to the height of an iframe in all browsers, but IE, and the RadWindow's content is actually an iframe when an external page is loaded. That being said we have taken into account this browser limitation and the height of the RadWindow is limited in non-IE browsers.

    You can reproduce the same issue with no complex controls at all:

    <table style="height: 80px; border: 3px solid green">
        <tr style="height: 100%">
            <td style="height: 100%">
                <iframe style="border: 1px solid red; height: 100%" src=""></iframe>

    What I would suggest is that you do not set content with heights smaller than 150px.

    If you want to have a smaller RadWindow you could use its ContentTemplate and add the controls directly there, instead of using an external page, if this is possible in your scenario.

    As for setting the height to the <tbody> tag - this does not work on all browsers and therefore is not a solution we can implement in the code.

    All the best,
    the Telerik team
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Back to Top