Radwindow CssClass height/width with important not rendering

2 posts, 0 answers
  1. Geoff
    Geoff avatar
    27 posts
    Member since:
    May 2012

    Posted 10 Dec 2013 Link to this post

    I am using a rad window to display a web url, setting what I want specifically through the css as far as the size of it. This however is not working.

    MarkUp
    <telerik:RadWindow ID="ViewOurCatalogsRadWindow" runat="server" Behaviors="Close"
        BorderStyle="None" KeepInScreenBounds="true" IconUrl="/Images/JJIcon16x16.jpg"
        CssClass="view-our-jewelry-catalog-window" VisibleStatusbar="false" Animation="Slide"
        Style="z-index: 9000;">
    </telerik:RadWindow>

    Css
    .view-our-jewelry-catalog-window
    {
        width:600px !important;
        height:600px !important;
    }

    If I set the width/height through the markup, I am able to get the desired effect. As I am building this with responsive design, this will not work for me. I thought it could possibly be the the Url links I was pointing to, but have tried it with many other outside sources and it is not working with them as well.

    Firebug shows that my css is rending, however, it looks to still be applying the default css (not class name or style page show either for this, just a straight element). Here is what it is showing.

    element.style {
        height: 300px;
        left: 491px;
        position: absolute;
        top: 85px;
        visibility: visible;
        width: 300px;
        z-index: 9000;
    }

    Any insight would be appreciated.


  2. Marin Bratanov
    Admin
    Marin Bratanov avatar
    3602 posts

    Posted 11 Dec 2013 Link to this post

    Hi Geoff,

    RadWindow calculates its size via JavaScript and sets the needed dimensions via JavaScript directly to its element, which is why CSS rules cannot be used for this.
    If you want to resize it with the window resize I advise that you examine the following knowledge base article: http://www.telerik.com/support/kb/aspnet-ajax/window/setting-size-in-percent-for-the-radwindow.aspx.

    The control itself cannot be responsive - it is a popup, which means it is not part of the main flow of the page layout. Thus, it cannot have a strictly defined responsive behavior - should it resize if the viewport resizes and if so - how much? Should it reposition itself and if so - where? How should it handle cases when one developer wants it to remain static and with unchanged size so it fits the form contained in it, and another wants it to resize with the viewport? These are all questions whose answer we cannot define because doing so will limit a great number of scenarios.

    I hope this answers your questions.


    Regards,
    Marin Bratanov
    Telerik
    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 the blog feed now.
  3. UI for ASP.NET Ajax is Ready for VS 2017
Back to Top